/* ============================================================
   Sanaté · Sistema visual — v2 — Morona Santiago, Ecuador
   ============================================================ */
:root {
  --s-verde:      #2d7a3a;
  --s-verde-osc:  #1a3a2a;
  --s-verde-cl:   #e8f5e9;
  --s-lima:       #c5e617;
  --s-terra:      #C1410B;
  --s-terra-dk:   #8f2e07;
  --s-terra-cl:   #FBF0EB;
  --s-arcilla:    #D4845A;
  --s-crema:      #F7F1E8;
  --s-crema-dk:   #ede4d6;
  --s-text:       #1c1c1c;
  --s-muted:      #6b6b6b;
  --s-border:     #e8e0d6;
  --s-r:          12px;
  --s-r-lg:       18px;
  --s-r-pill:     100px;
  --s-shadow-xs:  0 1px 4px rgba(0,0,0,.07);
  --s-shadow-sm:  0 2px 12px rgba(0,0,0,.09);
  --s-shadow:     0 6px 28px rgba(0,0,0,.13);
  --s-shadow-lg:  0 14px 56px rgba(0,0,0,.18);
  --s-ease:       cubic-bezier(.4,0,.2,1);
  --s-dur:        .24s;
}

/* ══════════════════════════════════════════════════════
   PRODUCT CARDS — restyling completo tarjetas nativas PS
   Aplica en homepage, cross-selling, cualquier grid nativo
   ══════════════════════════════════════════════════════ */

/* Wrapper */
.product-miniature {
  display: flex;
  flex-direction: column;
}

/* Card principal */
.product-miniature .card,
.product-miniature .card-product {
  border: 1.5px solid var(--s-border) !important;
  border-radius: var(--s-r-lg) !important;
  box-shadow: var(--s-shadow-xs) !important;
  background: #fff !important;
  overflow: hidden;
  transition: transform var(--s-dur) var(--s-ease),
              box-shadow var(--s-dur),
              border-color var(--s-dur) !important;
  height: 100%;
}
.product-miniature .card:hover,
.product-miniature .card-product:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 18px 52px rgba(0,0,0,.14) !important;
  border-color: var(--s-verde) !important;
}

/* Imagen — cuadrada, sin espacio vacío */
.product-miniature .thumbnail-container {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--s-crema);
  position: relative;
  display: flex; align-items: center; justify-content: center;
}
.product-miniature .thumbnail-container a {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
}
.product-miniature .card-img-top,
.product-miniature img.card-img-top {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  padding: .75rem !important;
  transition: transform .5s var(--s-ease) !important;
}
.product-miniature .card:hover .card-img-top,
.product-miniature .card-product:hover .card-img-top {
  transform: scale(1.07) !important;
}

/* Badges / flags — rediseñadas */
.product-miniature .product-flags {
  position: absolute; top: .7rem; left: .7rem;
  display: flex; flex-direction: column; gap: .3rem;
  z-index: 2;
}
.product-miniature .product-flag {
  border-radius: var(--s-r-pill) !important;
  font-size: .64rem !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase;
  padding: .18rem .65rem !important;
  line-height: 1.4 !important;
  display: inline-block;
}
.product-miniature .product-flag.new         { background: var(--s-verde) !important;  color: #fff !important; }
.product-miniature .product-flag.discount    { background: var(--s-terra) !important;  color: #fff !important; }
.product-miniature .product-flag.out_of_stock { display: none !important; }

/* Botón wishlist */
.product-miniature .wishlist-button-add,
.product-miniature button.wishlist-button-add {
  position: absolute !important;
  top: .65rem; right: .65rem;
  background: rgba(255,255,255,.88) !important;
  border: 1px solid var(--s-border) !important;
  border-radius: 50% !important;
  width: 34px !important; height: 34px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  transition: background var(--s-dur), border-color var(--s-dur), transform var(--s-dur) !important;
  z-index: 2;
}
.product-miniature .wishlist-button-add:hover {
  background: #fff !important;
  border-color: var(--s-terra) !important;
  transform: scale(1.1) !important;
}
.product-miniature .wishlist-button-add svg,
.product-miniature .wishlist-button-add i {
  color: var(--s-muted) !important; font-size: .85rem;
}

/* Card body */
.product-miniature .card-body {
  padding: .85rem 1rem 1rem !important;
  display: flex; flex-direction: column; gap: .28rem;
}
.product-miniature .h3.product-title,
.product-miniature .product-title {
  font-size: .9rem !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.product-miniature .product-title a {
  color: var(--s-verde-osc) !important;
  text-decoration: none !important;
}
.product-miniature .product-title a:hover { color: var(--s-verde) !important; }

/* Precio */
.product-miniature .product-price-and-shipping {
  margin-top: .25rem !important;
}
.product-miniature .price {
  font-size: 1.1rem !important;
  font-weight: 900 !important;
  color: var(--s-verde) !important;
  letter-spacing: -.02em !important;
}
.product-miniature .regular-price {
  font-size: .78rem !important;
  color: var(--s-muted) !important;
  text-decoration: line-through !important;
}

/* Botón add to cart en miniatura */
.product-miniature .add-to-cart,
.product-miniature button.add-to-cart {
  width: 100% !important;
  margin-top: .6rem !important;
  border-radius: var(--s-r-pill) !important;
  font-size: .8rem !important;
  font-weight: 800 !important;
  padding: .55rem 1rem !important;
  background: var(--s-verde) !important;
  border-color: var(--s-verde) !important;
  transition: background var(--s-dur), transform var(--s-dur) !important;
}
.product-miniature .add-to-cart:hover {
  background: var(--s-verde-osc) !important;
  transform: translateY(-1px) !important;
}

/* Grid de productos nativo */
.products .product-miniature,
#js-product-list .product-miniature {
  margin-bottom: 1.5rem;
}

/* ── Topbar ─────────────────────────────────────────── */
#sanate-topbar {
  background: var(--s-verde-osc);
  color: rgba(255,255,255,.82);
  text-align: center;
  padding: .46rem 1rem;
  font-size: .78rem;
  font-weight: 500;
  letter-spacing: .02em;
  z-index: 200;
  position: relative;
}
#sanate-topbar strong { color: #fff; }
#sanate-topbar a      { color: #fff; text-decoration: underline; }

/* ── WhatsApp flotante ──────────────────────────────── */
#sanate-whatsapp { position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 9999; }
#sanate-whatsapp .wa-btn {
  display: flex; align-items: center; gap: .6rem;
  background: #25d366; color: #fff;
  padding: .75rem 1.3rem; border-radius: var(--s-r-pill);
  font-weight: 700; font-size: .88rem;
  box-shadow: 0 4px 20px rgba(37,211,102,.4);
  text-decoration: none;
  transition: background var(--s-dur) var(--s-ease),
              transform var(--s-dur) var(--s-ease),
              box-shadow var(--s-dur) var(--s-ease);
  white-space: nowrap;
}
#sanate-whatsapp .wa-btn:hover {
  background: #1da851;
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(37,211,102,.5);
}
@media (max-width: 600px) {
  #sanate-whatsapp .wa-label { display: none; }
  #sanate-whatsapp .wa-btn   { padding: .75rem; border-radius: 50%; }
}

/* ── Header / nav / footer ──────────────────────────── */
#header           { border-bottom: 3px solid var(--s-verde) !important; }
#footer           { border-top:    3px solid var(--s-verde) !important; }
.page-header h1,
.breadcrumb-item a,
.breadcrumb-item.active,
.product-miniature .product-title a,
h1.h1[itemprop="name"]              { color: var(--s-verde) !important; }
.product-price,
.product-prices .price,
span.price                          { color: var(--s-verde) !important; font-weight: 800 !important; }
.btn-primary, .add-to-cart,
button[data-button-action="add-to-cart"] {
  background-color: var(--s-verde) !important;
  border-color:     var(--s-verde) !important;
  border-radius:    var(--s-r-pill) !important;
  font-weight: 700 !important;
  transition: background var(--s-dur), transform var(--s-dur) !important;
}
.btn-primary:hover, .add-to-cart:hover,
button[data-button-action="add-to-cart"]:hover {
  background-color: var(--s-verde-osc) !important;
  border-color:     var(--s-verde-osc) !important;
  transform: translateY(-1px);
}

/* ── Sello + botón WA en ficha ──────────────────────── */
.sanate-seal {
  display: inline-flex; align-items: center; gap: .4rem;
  background: var(--s-verde-cl); color: var(--s-verde);
  border: 1px solid rgba(45,122,58,.2);
  padding: .3rem .85rem; border-radius: var(--s-r-pill);
  font-size: .75rem; font-weight: 700; letter-spacing: .04em;
  margin-top: .75rem;
}
.sanate-order-btn {
  display: flex; align-items: center; gap: .5rem; justify-content: center;
  background: #25d366; color: #fff !important;
  border: none; border-radius: var(--s-r-pill);
  padding: .7rem 1.4rem; font-weight: 700; font-size: .9rem;
  margin-top: .6rem; width: 100%; cursor: pointer;
  text-decoration: none !important;
  transition: background var(--s-dur), transform var(--s-dur);
}
.sanate-order-btn:hover { background: #1da851; transform: translateY(-1px); }

/* ── Tabla descripción ──────────────────────────────── */
.product-description table { width:100%; border-collapse:collapse; margin:1rem 0; }
.product-description table th {
  background: var(--s-verde); color:#fff;
  padding:.6rem 1rem; font-size:.85rem; text-align:left;
}
.product-description table td { padding:.55rem 1rem; border-bottom:1px solid #eee; }
.product-description table tr:nth-child(even) td { background: var(--s-verde-cl); }


/* ══════════════════════════════════════════════════════
   CATÁLOGO INFUSIONES
   ══════════════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════
   SECCIONES INYECTADAS — reset de contenedores CE/PS
   Garantiza que nuestras secciones no queden encajadas
   dentro del grid de Bootstrap ni del contenedor CE.
   ══════════════════════════════════════════════════════ */
#san-catalog,
#ker-catalog,
#caf-page {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
  overflow-x: hidden;
}
/* El padre inmediato que takeover() rellenó */
#san-catalog + *,
#ker-catalog + *,
#caf-page + * {
  display: none !important;
}

/* ══════════════════════════════════════════════════════
   INFUSIONES — página completa de identidad
   ══════════════════════════════════════════════════════ */
#san-catalog {
  --san-display: 'Cormorant Garamond', Georgia, serif;
  --san-body:    'DM Sans', system-ui, -apple-system, sans-serif;
  --san-paper:   #F0EDE4;
  --san-ink:     #0D1A09;
  --san-smoke:   #3A4A30;
  --san-line:    rgba(13,26,9,.1);
  font-family: var(--san-body);
  background: var(--san-paper);
  color: var(--san-ink);
}

/* — Hero — */
.san-hero {
  background:
    linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(7,26,14,.5) 42%, rgba(7,26,14,.93) 68%, #071a0e 100%),
    linear-gradient(135deg, #0a1e0d 0%, #112b14 50%, #091810 100%);
  position: relative; overflow: hidden;
  height: 72vh; min-height: 520px;
  display: flex; flex-direction: column; justify-content: flex-end;
  color: #fff;
}
.san-hero::before,
.san-hero::after { display: none; }
.san-hero-brand {
  position: relative; z-index: 1;
  padding: 0 4rem 2.5rem;
  display: flex; flex-direction: column; align-items: flex-start;
}
.san-hero-main {
  display: block;
  font-family: var(--san-display);
  font-size: clamp(3.5rem, 9vw, 7rem);
  font-weight: 300; letter-spacing: .05em;
  color: #fff; line-height: .85;
}
.san-hero-xtra {
  display: block;
  font-family: var(--san-display);
  font-size: clamp(1.5rem, 3.2vw, 2.8rem);
  font-weight: 300; font-style: italic;
  color: var(--s-lima); letter-spacing: .08em;
  line-height: 1.1; margin-top: .25rem; margin-bottom: 1.4rem;
}
.san-hero-desc {
  font-size: .84rem; color: rgba(255,255,255,.68);
  line-height: 1.7; max-width: 400px; margin: 0 0 1.4rem;
}
.san-hero-pills {
  display: flex; flex-wrap: wrap; gap: .4rem;
}
.san-hero-pills span {
  background: rgba(197,230,23,.12);
  border: 1px solid rgba(197,230,23,.28);
  color: rgba(255,255,255,.88);
  border-radius: 3px; padding: .28rem .85rem;
  font-size: .66rem; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase;
  transition: background .2s, border-color .2s;
}
.san-hero-pills span:hover {
  background: rgba(197,230,23,.22); border-color: rgba(197,230,23,.5);
}
.san-hero-foot {
  position: absolute; bottom: 1.8rem; right: 3rem; z-index: 1;
  display: flex; flex-direction: column; align-items: flex-end; gap: .3rem;
}
.san-hero-loc {
  font-size: .6rem; font-weight: 600; letter-spacing: .2em;
  text-transform: uppercase; color: rgba(255,255,255,.3);
}
.san-hero-badge {
  font-size: .6rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--s-lima); opacity: .65;
}
@media (max-width: 820px) {
  .san-hero { height: auto; min-height: 480px; }
  .san-hero-brand { padding: 0 2rem 3rem; }
  .san-hero-foot { right: 1.5rem; bottom: 1.4rem; }
  .san-hero-desc { max-width: 100%; }
}
@media (max-width: 500px) {
  .san-hero { min-height: 420px; }
  .san-hero-main { font-size: clamp(3rem, 13vw, 4.5rem); }
  .san-hero-brand { padding: 0 1.5rem 2.5rem; }
}

/* — Franja de datos — */
.san-values {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: #fff;
  border-bottom: 1px solid var(--s-border);
}
.san-val {
  display: flex; flex-direction: column; align-items: center;
  gap: .15rem; padding: 1.6rem 1rem 1.5rem; text-align: center;
  border-right: 1px solid var(--s-border);
  transition: background var(--s-dur);
}
.san-val:last-child { border-right: none; }
.san-val:hover { background: var(--s-verde-cl); }
.san-val-n {
  font-size: 2.4rem; font-weight: 900; color: var(--s-verde);
  letter-spacing: -.04em; line-height: 1;
  font-variant-numeric: tabular-nums;
}
.san-val b { font-size: .82rem; font-weight: 800; color: var(--s-verde-osc); margin-top: .25rem; }
.san-val span { font-size: .72rem; color: var(--s-muted); line-height: 1.3; }
@media (max-width: 720px) {
  .san-values { grid-template-columns: repeat(2,1fr); }
  .san-val:nth-child(2) { border-right: none; }
  .san-val:nth-child(1),
  .san-val:nth-child(2) { border-bottom: 1px solid var(--s-border); }
}
@media (max-width: 420px) {
  .san-values { grid-template-columns: repeat(2,1fr); }
  .san-val-n { font-size: 2rem; }
}

/* — Proceso editorial — 3 columnas conectadas */
.san-proceso {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0;
  background: var(--san-paper);
  border-top: 3px solid var(--san-ink);
}
.san-paso {
  display: flex; flex-direction: column; gap: .8rem;
  padding: 2.8rem 2.4rem;
  border-right: 1px solid var(--s-border);
  position: relative;
}
.san-paso:last-child { border-right: none; }
.san-paso-sep { display: none; }
/* número grande — estructural */
.san-paso-num {
  font-family: var(--san-display);
  font-size: clamp(3rem, 5vw, 5rem); font-weight: 300;
  color: rgba(13,43,24,.2);
  line-height: 1; letter-spacing: -.04em;
  font-variant-numeric: tabular-nums;
  margin-bottom: -.5rem;
}
/* línea de conexión entre pasos */
.san-paso::after {
  content: '';
  position: absolute; right: -1px; top: 50%;
  width: 8px; height: 8px;
  background: var(--s-verde);
  border-radius: 50%;
  transform: translateY(-50%);
  opacity: .4;
}
.san-paso:last-child::after { display: none; }
.san-paso-body h3 {
  font-size: 1rem; font-weight: 700; color: var(--san-ink);
  line-height: 1.2; margin: 0 0 .5rem; letter-spacing: -.01em;
}
.san-paso-body p {
  font-size: .82rem; color: var(--san-smoke); line-height: 1.68; margin: 0;
}
@media (max-width: 820px) {
  .san-proceso { grid-template-columns: 1fr; }
  .san-paso { padding: 1.5rem 1.5rem; border-right: none; border-bottom: 1px solid var(--s-border); }
  .san-paso:last-child { border-bottom: none; }
  .san-paso::after { display: none; }
  .san-paso-num { font-size: 3.5rem; }
}

/* — Grid header — */
.san-grid-wrap { padding: 3rem 2.5rem 1.5rem; max-width: 1380px; margin: 0 auto; }
.san-section-label {
  font-size: .7rem; font-weight: 800; letter-spacing: .18em;
  text-transform: uppercase; color: var(--s-muted);
  margin-bottom: 1.5rem;
  display: flex; align-items: center; gap: .8rem;
}
.san-section-label::after {
  content: ''; flex: 1; height: 1px; background: var(--s-border);
}
.san-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
@media (max-width: 900px) { .san-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 520px) { .san-grid { grid-template-columns: 1fr; gap:.85rem; } .san-grid-wrap { padding:1rem; } }

/* — Tarjeta infusión — */
.san-card {
  background: #fff;
  border-radius: var(--s-r-lg);
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,.07);
  border: 1.5px solid var(--s-border);
  text-decoration: none;
  display: flex; flex-direction: column;
  transition: transform .32s var(--s-ease), box-shadow .32s, border-color .22s;
  opacity: 0; transform: translateY(28px);
  cursor: pointer;
  position: relative;
}
/* barra de color superior — identidad por infusión */
.san-card::before {
  content: ''; display: block;
  height: 4px; width: 100%;
  background: var(--acc, var(--s-verde));
  opacity: .85;
  transition: opacity .22s;
}
.san-card:hover::before { opacity: 1; }
.san-card.visible { opacity: 1; transform: translateY(0); }
.san-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 56px rgba(0,0,0,.16);
  border-color: var(--acc, var(--s-verde));
  text-decoration: none;
}

/* imagen */
.san-img-wrap {
  position: relative; aspect-ratio: 16/10; overflow: hidden;
}
.san-img-wrap img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .55s var(--s-ease);
}
.san-card:hover .san-img-wrap img { transform: scale(1.07); }
.san-img-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.52) 0%, transparent 55%);
  display: flex; align-items: flex-end; padding: .75rem;
}
.san-badge-pill {
  background: var(--acc, var(--s-verde));
  color: #fff;
  font-size: .65rem; font-weight: 800; padding: .22rem .7rem;
  border-radius: var(--s-r-pill); letter-spacing: .07em;
  text-transform: uppercase;
  box-shadow: 0 2px 8px rgba(0,0,0,.28);
}

/* info */
.san-info { padding: 1.1rem 1.2rem 1.2rem; display: flex; flex-direction: column; gap: .35rem; flex: 1; }
.san-tags-row { display: flex; flex-wrap: wrap; gap: .28rem; margin-bottom: .1rem; }
.san-tag {
  background: var(--light, #e8f5e9);
  color: var(--acc, var(--s-verde));
  border-radius: var(--s-r-pill); padding: .16rem .58rem;
  font-size: .64rem; font-weight: 800; letter-spacing: .04em;
  text-transform: uppercase;
}
.san-name {
  font-size: 1.05rem; font-weight: 900; color: var(--s-verde-osc);
  line-height: 1.2; letter-spacing: -.02em;
}
.san-desc {
  font-size: .79rem; color: var(--s-muted); line-height: 1.55; flex: 1;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.san-footer {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: .8rem; padding-top: .8rem;
  border-top: 1.5px solid var(--s-border);
}
.san-price { font-size: 1.2rem; font-weight: 900; color: var(--acc, var(--s-verde)); letter-spacing: -.02em; }
.san-cta {
  background: var(--acc, var(--s-verde)); color: #fff;
  border-radius: var(--s-r-pill); padding: .38rem 1rem;
  font-size: .74rem; font-weight: 800; letter-spacing: .04em;
  text-transform: uppercase;
  transition: filter .2s, transform .2s;
}
.san-card:hover .san-cta { filter: brightness(1.12); transform: translateX(3px); }

/* — Franja de datos — versión más impactante */
.san-values {
  display: grid; grid-template-columns: repeat(4, 1fr);
  background: var(--s-verde-osc);
  border-top: none; border-bottom: none;
}
.san-val {
  display: flex; flex-direction: column; align-items: center;
  gap: .2rem; padding: 2rem 1rem; text-align: center;
  border-right: 1px solid rgba(255,255,255,.1);
  transition: background .2s;
}
.san-val:last-child { border-right: none; }
.san-val:hover { background: rgba(255,255,255,.05); }
.san-val-n {
  font-family: var(--san-display);
  font-size: clamp(2.8rem, 5vw, 3.8rem); font-weight: 300; color: var(--s-lima);
  letter-spacing: -.04em; line-height: .9;
  font-variant-numeric: tabular-nums; display: block;
}
.san-val b { font-size: .76rem; font-weight: 700; color: #fff; margin-top: .35rem; }
.san-val span { font-size: .68rem; color: rgba(255,255,255,.78); line-height: 1.3; }

/* — CTA bar inferior — */
.san-cta-bar {
  background: linear-gradient(135deg, #071a0e 0%, #0d2b18 100%);
  color: #fff;
  padding: 3rem 2rem; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 1.25rem;
  position: relative; overflow: hidden;
}
/* sin patrón */
.san-cta-bar::before { display: none; }
.san-cta-bar p { margin: 0; font-size: 1.05rem; color: rgba(255,255,255,.75); position: relative; z-index: 1; }
.san-cta-wa {
  position: relative; z-index: 1;
  display: inline-flex; align-items: center; gap: .65rem;
  background: #25d366; color: #fff !important; text-decoration: none !important;
  border-radius: var(--s-r-pill); padding: .9rem 2rem;
  font-weight: 800; font-size: .95rem; letter-spacing: .02em;
  box-shadow: 0 6px 24px rgba(37,211,102,.4);
  transition: background .22s, transform .22s;
}
.san-cta-wa:hover { background: #1da851; transform: translateY(-2px); }

/* ══════════════════════════════════════════════════════
   BLOG EDITORIAL — Infusiones
   ══════════════════════════════════════════════════════ */
.san-blog {
  background: #0c1a10;
  padding: 3.5rem 2rem 4rem;
  position: relative;
  overflow: hidden;
}
.san-blog::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 80% 50% at 50% 0%, rgba(197,230,23,.05) 0%, transparent 68%);
  pointer-events: none;
}
.san-blog-inner { max-width: 1320px; margin: 0 auto; position: relative; z-index: 1; }
.san-blog-hd { text-align: center; margin-bottom: 2.5rem; }
.san-blog-ey {
  display: block; font-size: .72rem; font-weight: 800; letter-spacing: .14em;
  text-transform: uppercase; color: var(--s-lima); margin-bottom: .5rem;
}
.san-blog-title {
  font-family: var(--san-display);
  font-size: clamp(1.8rem, 3.5vw, 2.6rem); font-weight: 400; font-style: italic;
  letter-spacing: -.01em; line-height: 1.1; margin: 0 0 .6rem; color: #fff;
}
.san-blog-title span { color: var(--s-lima); }
.san-blog-sub {
  font-size: .88rem; color: rgba(255,255,255,.75);
  max-width: 420px; margin: 0 auto; line-height: 1.6;
}
.san-blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}
@media (max-width: 860px) {
  .san-blog-grid { grid-template-columns: 1fr; max-width: 440px; margin: 0 auto; gap: 1rem; }
}

/* — tarjeta blog — */
.san-bcard {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--s-r-lg);
  overflow: hidden;
  display: flex; flex-direction: column;
  text-decoration: none; color: #fff;
  transition: transform var(--s-dur) var(--s-ease),
              background var(--s-dur), border-color var(--s-dur);
  opacity: 0; transform: translateY(24px);
}
.san-bcard.visible {
  opacity: 1; transform: translateY(0);
  transition: opacity .42s var(--s-ease), transform .42s var(--s-ease),
              box-shadow var(--s-dur), border-color var(--s-dur);
}
.san-bcard:hover {
  transform: translateY(-5px);
  background: rgba(255,255,255,.09);
  border-color: rgba(255,255,255,.2);
  text-decoration: none; color: #fff;
}

/* barra superior de color */
.san-bcard-accent {
  height: 3px;
  background: var(--bcard-acc, var(--s-lima));
  transition: height .18s;
}
.san-bcard:hover .san-bcard-accent { height: 5px; }

/* meta row */
.san-bcard-top {
  display: flex; align-items: center; justify-content: space-between;
  padding: .9rem 1.1rem .3rem;
}
.san-bcard-cat {
  font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: var(--bcard-acc, var(--s-lima));
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
  padding: .15rem .55rem; border-radius: var(--s-r-pill);
}
.san-bcard-time { font-size: .66rem; color: rgba(255,255,255,.58); letter-spacing: .03em; }

/* número decorativo translúcido */
.san-bcard-deco {
  font-size: 4.5rem; font-weight: 900; line-height: 1;
  color: rgba(255,255,255,.035); letter-spacing: -.06em;
  padding: 0 1.1rem; margin-bottom: -.55rem;
  font-variant-numeric: tabular-nums; pointer-events: none;
}

/* contenido */
.san-bcard-body { padding: .5rem 1.1rem .85rem; flex: 1; }
.san-bcard-body h3 {
  font-size: .96rem; font-weight: 800; line-height: 1.35;
  color: rgba(255,255,255,.92); margin: 0 0 .55rem;
  letter-spacing: -.02em;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.san-bcard-body p {
  font-size: .77rem; color: rgba(255,255,255,.72); line-height: 1.63; margin: 0;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}

/* footer */
.san-bcard-foot {
  display: flex; align-items: center; justify-content: space-between;
  padding: .7rem 1.1rem .95rem;
  border-top: 1px solid rgba(255,255,255,.07); margin-top: auto;
}
.san-bcard-date { font-size: .67rem; color: rgba(255,255,255,.28); letter-spacing: .04em; }
.san-bcard-cta {
  font-size: .74rem; font-weight: 800;
  color: var(--bcard-acc, var(--s-lima)); letter-spacing: .02em;
  transition: letter-spacing .18s var(--s-ease);
}
.san-bcard:hover .san-bcard-cta { letter-spacing: .07em; }


/* ══════════════════════════════════════════════════════
   CAFÉ PAGE — v3 Editorial
   Fuentes: Cormorant Garamond (display) + DM Sans (body)
   6 secciones: Hero · Editorial · Producto ·
   Compromisos · Impacto · CTA
   ══════════════════════════════════════════════════════ */
#caf-page {
  --cf-paper:   #F4EFE6;
  --cf-ink:     #150E05;
  --cf-forest:  #0A1A0C;
  --cf-gold:    #A87012;
  --cf-gold-lt: #D4A030;
  --cf-smoke:   #4A3A26;
  --cf-line:    rgba(21,14,5,.1);
  --cf-display: 'Cormorant Garamond', Georgia, serif;
  --cf-body:    'DM Sans', system-ui, -apple-system, sans-serif;
  font-family: var(--cf-body);
  background: var(--cf-paper);
  color: var(--cf-ink);
}

/* ── 1. Hero ──────────────────────────────────────── */
.caf-s1 {
  position: relative;
  height: 100vh; min-height: 600px;
  display: flex; flex-direction: column; justify-content: flex-end;
  overflow: hidden;
}
.caf-s1-img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 25%;
}
.caf-s1-ovl {
  position: absolute; inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.06) 35%,
    rgba(10,26,12,.68) 60%,
    rgba(10,26,12,.95) 80%,
    #0A1A0C 100%
  );
}
.caf-s1-brand {
  position: relative; z-index: 1;
  padding: 0 4rem 3.5rem;
  display: flex; flex-direction: column; align-items: flex-start;
}
.caf-s1-atasim {
  display: block;
  font-family: var(--cf-display);
  font-size: clamp(3.5rem, 9vw, 7rem);
  font-weight: 300; letter-spacing: .06em;
  color: #fff; line-height: .85;
}
.caf-s1-coffee {
  display: block; font-family: var(--cf-display);
  font-size: clamp(1.4rem, 3vw, 2.6rem);
  font-weight: 400; font-style: italic;
  color: var(--cf-gold-lt); letter-spacing: .1em;
  line-height: 1.1; margin-bottom: 1.8rem;
}
.caf-s1-cta {
  display: inline-flex; align-items: center; gap: .45rem;
  background: #25d366; color: #fff !important;
  text-decoration: none !important;
  padding: .7rem 1.4rem; border-radius: 4px;
  font-family: var(--cf-body);
  font-size: .8rem; font-weight: 700; letter-spacing: .02em;
  white-space: nowrap;
  transition: background .2s, transform .2s;
}
.caf-s1-cta:hover { background: #1db954; transform: translateY(-2px); }
.caf-s1-footer {
  position: absolute; bottom: 1.8rem; right: 3rem; z-index: 1;
  display: flex; flex-direction: column; align-items: flex-end; gap: .28rem;
}
.caf-s1-loc {
  font-size: .6rem; font-weight: 600; letter-spacing: .2em;
  text-transform: uppercase; color: rgba(255,255,255,.32);
}
.caf-s1-badge {
  font-size: .6rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--cf-gold-lt); opacity: .65;
}

/* ── 2. Editorial pull-quote + dato ──────────────── */
.caf-s2 {
  display: grid; grid-template-columns: 1.1fr .9fr;
  align-items: center;
  background: var(--cf-paper);
  padding: 7rem 4rem;
  gap: 5rem;
  border-bottom: 1px solid var(--cf-line);
}
.caf-s2-quote {
  font-family: var(--cf-display);
  font-size: clamp(1.5rem, 2.8vw, 2.2rem);
  font-weight: 400; font-style: italic;
  line-height: 1.5; color: var(--cf-ink);
  margin: 0;
  padding-left: 2rem;
  border-left: 3px solid var(--cf-gold);
  quotes: none;
}
.caf-s2-right {
  display: flex; flex-direction: column;
  padding-left: 2.5rem; border-left: 1px solid var(--cf-line);
}
.caf-s2-n {
  font-family: var(--cf-display);
  font-size: clamp(5rem, 12vw, 9.5rem);
  font-weight: 300; line-height: .88;
  color: var(--cf-ink); letter-spacing: -.04em;
  display: block; font-variant-numeric: tabular-nums;
}
.caf-s2-unit {
  font-size: .68rem; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--cf-smoke);
  display: block; margin: .5rem 0 1.5rem;
  line-height: 1.5;
}
.caf-s2-sub {
  font-size: .83rem; color: var(--cf-smoke); line-height: 1.78; margin: 0;
  border-top: 1px solid var(--cf-line); padding-top: 1.2rem;
}

/* ── 3. Producto ─────────────────────────────────── */
.caf-s3 {
  display: grid; grid-template-columns: 1fr 1fr;
  align-items: stretch;
  border-bottom: 1px solid var(--cf-line);
}
.caf-s3-img {
  padding: 4.5rem 3.5rem;
  display: flex; align-items: center; justify-content: center;
  background: var(--cf-paper);
  min-height: 520px;
}
.caf-s3-img img {
  max-width: 100%; max-height: 460px; object-fit: contain;
  filter: drop-shadow(0 20px 48px rgba(0,0,0,.22));
  transition: transform .55s cubic-bezier(.4,0,.2,1);
}
.caf-s3-img:hover img { transform: scale(1.03) translateY(-6px); }
.caf-s3-body {
  padding: 4.5rem 4.5rem 4.5rem 4rem;
  background: var(--cf-paper);
  display: flex; flex-direction: column; gap: 1.5rem;
  justify-content: center;
}
.caf-s3-label {
  font-size: .6rem; font-weight: 700; letter-spacing: .22em;
  text-transform: uppercase; color: var(--cf-gold);
}
.caf-s3-h2 {
  font-family: var(--cf-display);
  font-size: clamp(2rem, 3.5vw, 3rem);
  font-weight: 500; letter-spacing: -.02em; line-height: 1.05;
  color: var(--cf-forest); margin: 0;
}
.caf-s3-specs {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  border: 1px solid var(--cf-line); border-radius: 8px; overflow: hidden;
}
.caf-s3-specs > div {
  padding: .62rem 1rem;
  border-bottom: 1px solid var(--cf-line);
  display: flex; flex-direction: column; gap: .06rem;
}
.caf-s3-specs > div:nth-child(odd)  { border-right: 1px solid var(--cf-line); }
.caf-s3-specs > div:nth-last-child(-n+2) { border-bottom: none; }
.caf-s3-specs span {
  font-size: .58rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--cf-smoke);
}
.caf-s3-specs b { font-size: .84rem; font-weight: 700; color: var(--cf-ink); }
.caf-s3-buy {
  display: flex; align-items: center; gap: 2rem; flex-wrap: wrap;
  padding-top: 1.5rem; border-top: 1px solid var(--cf-line);
}
.caf-s3-price {
  font-family: var(--cf-display);
  font-size: 3.5rem; font-weight: 300; color: var(--cf-gold);
  line-height: 1; letter-spacing: -.04em;
}
.caf-s3-btn {
  display: inline-flex; align-items: center; gap: .45rem;
  background: #25d366; color: #fff !important;
  text-decoration: none !important;
  padding: .78rem 1.6rem; border-radius: 4px;
  font-size: .84rem; font-weight: 700;
  transition: background .2s, transform .2s;
}
.caf-s3-btn:hover { background: #1db954; transform: translateY(-2px); }

/* ── 4. Tres compromisos ─────────────────────────── */
.caf-s4 {
  background: var(--cf-forest);
  padding: 6rem 4rem;
}
.caf-s4-hd { max-width: 560px; margin-bottom: 4.5rem; }
.caf-s4-label {
  display: block; font-size: .6rem; font-weight: 700; letter-spacing: .22em;
  text-transform: uppercase; color: var(--cf-gold-lt); opacity: .75;
  margin-bottom: .9rem;
}
.caf-s4-h2 {
  font-family: var(--cf-display);
  font-size: clamp(1.9rem, 3.5vw, 2.9rem);
  font-weight: 400; font-style: italic;
  letter-spacing: -.02em; line-height: 1.15;
  color: #fff; margin: 0;
}
.caf-s4-items { display: flex; flex-direction: column; }
.caf-s4-item {
  display: grid; grid-template-columns: 110px 1fr;
  gap: 3rem; align-items: start;
  padding: 3rem 0;
  border-top: 1px solid rgba(255,255,255,.07);
}
.caf-s4-item:last-child { border-bottom: 1px solid rgba(255,255,255,.07); }
.caf-s4-n {
  font-family: var(--cf-display);
  font-size: clamp(3.5rem, 6vw, 5.5rem);
  font-weight: 300; line-height: 1;
  color: rgba(168,112,18,.22); letter-spacing: -.04em;
  display: block; text-align: right;
}
.caf-s4-body h3 {
  font-family: var(--cf-body);
  font-size: 1rem; font-weight: 700;
  color: rgba(255,255,255,.88); margin: .1rem 0 .8rem;
  letter-spacing: -.01em;
}
.caf-s4-body p {
  font-size: .84rem; color: rgba(255,255,255,.75); line-height: 1.82; margin: 0;
}

/* ── 5. Impacto ─────────────────────────────────── */
.caf-s5 { background: #7A5409; }
.caf-s5-inner {
  display: grid; grid-template-columns: repeat(4,1fr);
  max-width: 1280px; margin: 0 auto;
}
.caf-s5-stat {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: .4rem; padding: 3.5rem 1.5rem;
  border-right: 1px solid rgba(255,255,255,.18);
  text-align: center;
}
.caf-s5-stat:last-child { border-right: none; }
.caf-s5-n {
  font-family: var(--cf-display);
  font-size: clamp(2.8rem, 5vw, 4rem);
  font-weight: 300; color: #fff;
  line-height: .9; letter-spacing: -.04em; display: block;
}
.caf-s5-lbl {
  font-size: .64rem; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: rgba(255,255,255,.82);
  display: block;
}

/* ── 6. CTA final ────────────────────────────────── */
.caf-s6 {
  background: var(--cf-paper);
  text-align: center; padding: 8rem 2rem;
  border-top: 1px solid var(--cf-line);
}
.caf-s6-inner { max-width: 460px; margin: 0 auto; }
.caf-s6-eyebrow {
  display: block; font-size: .6rem; font-weight: 700;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--cf-smoke); margin-bottom: 1.5rem;
}
.caf-s6-h2 {
  font-family: var(--cf-display);
  font-size: clamp(2.3rem, 5vw, 3.5rem);
  font-weight: 400; font-style: italic;
  letter-spacing: -.02em; line-height: 1.2;
  color: var(--cf-ink); margin: 0 0 2.8rem;
}
.caf-s6-btn {
  display: inline-flex; align-items: center; gap: .5rem;
  background: #25d366; color: #fff !important;
  text-decoration: none !important;
  padding: .9rem 2rem; border-radius: 4px;
  font-size: .9rem; font-weight: 700;
  box-shadow: 0 4px 22px rgba(37,211,102,.3);
  transition: background .2s, transform .2s;
}
.caf-s6-btn:hover { background: #1db954; transform: translateY(-2px); }
.caf-s6-contact {
  font-size: .68rem; color: #8A7055;
  margin: 1.8rem 0 0; letter-spacing: .04em;
}

/* ── Responsive ──────────────────────────────────── */
@media (max-width: 960px) {
  .caf-s1-brand { padding: 0 2rem 3rem; }
  .caf-s1-footer { right: 1.5rem; }
  .caf-s2 { grid-template-columns: 1fr; padding: 5rem 2rem; gap: 3rem; }
  .caf-s2-right { border-left: none; border-top: 1px solid var(--cf-line); padding: 2rem 0 0; }
  .caf-s3 { grid-template-columns: 1fr; }
  .caf-s3-img { min-height: 340px; padding: 3rem 2.5rem; }
  .caf-s3-body { padding: 2.5rem 2rem; }
  .caf-s4 { padding: 4.5rem 2rem; }
  .caf-s4-item { grid-template-columns: 80px 1fr; gap: 1.8rem; padding: 2.2rem 0; }
  .caf-s5-inner { grid-template-columns: repeat(2,1fr); }
  .caf-s5-stat:nth-child(2) { border-right: none; }
  .caf-s5-stat:nth-child(3),
  .caf-s5-stat:nth-child(4) { border-top: 1px solid rgba(255,255,255,.18); }
  .caf-s6 { padding: 6rem 2rem; }
}
@media (max-width: 600px) {
  .caf-s1 { min-height: 100svh; }
  .caf-s1-atasim { font-size: clamp(3rem, 13vw, 4.5rem); }
  .caf-s1-coffee { font-size: clamp(1.2rem, 5vw, 1.8rem); }
  .caf-s2 { padding: 4rem 1.5rem; gap: 2.5rem; }
  .caf-s2-quote { font-size: 1.25rem; padding-left: 1rem; }
  .caf-s3-specs { grid-template-columns: 1fr; }
  .caf-s3-specs > div:nth-child(odd) { border-right: none; }
  .caf-s3-specs > div:nth-last-child(-n+2) { border-bottom: 1px solid var(--cf-line); }
  .caf-s3-specs > div:last-child { border-bottom: none; }
  .caf-s3-buy { gap: 1.2rem; }
  .caf-s4 { padding: 4rem 1.5rem; }
  .caf-s4-item { grid-template-columns: 1fr; gap: .4rem; }
  .caf-s4-n { text-align: left; font-size: 3rem; }
  .caf-s5-inner { grid-template-columns: repeat(2,1fr); }
  .caf-s6 { padding: 5rem 1.5rem; }
}

/* ══════════════════════════════════════════════════════
   CATÁLOGO CERÁMICA
   ══════════════════════════════════════════════════════ */
#ker-catalog {
  padding: 0 0 3rem;
  font-family: system-ui, -apple-system, sans-serif;
}

/* — Encabezado — */
.ker-header-bar {
  background: linear-gradient(135deg, var(--s-verde-osc) 0%, #2a5c35 100%);
  color: #fff;
  padding: 2.5rem 2rem 2rem;
  text-align: center;
}
.ker-header-bar h2 {
  margin: 0 0 .4rem;
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  font-weight: 900;
  letter-spacing: -.03em;
}
.ker-header-bar h2 span { color: var(--s-lima); }
.ker-header-bar p {
  margin: 0;
  font-size: .9rem;
  opacity: .75;
  max-width: 540px;
  margin: 0 auto;
  line-height: 1.5;
}

/* — Barra de filtros — */
.ker-filter-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 2rem;
  background: #fff;
  border-bottom: 1px solid var(--s-border);
  gap: 1rem;
  flex-wrap: wrap;
  position: sticky;
  top: 0;
  z-index: 50;
  box-shadow: var(--s-shadow-xs);
}
.ker-filters {
  display: flex;
  gap: .4rem;
  flex-wrap: wrap;
}
.ker-filter-btn {
  background: var(--s-crema);
  border: 1.5px solid var(--s-border);
  color: var(--s-muted);
  border-radius: var(--s-r-pill);
  padding: .35rem .9rem;
  font-size: .8rem;
  font-weight: 700;
  cursor: pointer;
  transition: all var(--s-dur) var(--s-ease);
  letter-spacing: .03em;
  white-space: nowrap;
}
.ker-filter-btn:hover {
  border-color: var(--s-terra);
  color: var(--s-terra);
  background: var(--s-terra-cl);
}
.ker-filter-btn.active {
  background: var(--s-terra);
  border-color: var(--s-terra);
  color: #fff;
}
.ker-sort-group {
  display: flex;
  align-items: center;
  gap: .5rem;
}
.ker-sort-label { font-size: .78rem; color: var(--s-muted); white-space: nowrap; }
.ker-sort-btn {
  background: none;
  border: 1.5px solid var(--s-border);
  border-radius: var(--s-r);
  padding: .32rem .75rem;
  font-size: .78rem;
  font-weight: 700;
  color: var(--s-text);
  cursor: pointer;
  transition: all var(--s-dur);
  display: flex;
  align-items: center;
  gap: .3rem;
}
.ker-sort-btn:hover { border-color: var(--s-terra); color: var(--s-terra); }
.ker-count {
  font-size: .78rem;
  color: var(--s-muted);
  white-space: nowrap;
}

/* — Grid — */
.ker-grid-wrap {
  padding: 1.75rem 2rem;
  max-width: 1320px;
  margin: 0 auto;
}
.ker-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}
@media (max-width: 1100px) { .ker-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 760px)  { .ker-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; } }
@media (max-width: 460px)  {
  .ker-grid { grid-template-columns: 1fr; gap: .85rem; }
  .ker-grid-wrap { padding: 1rem; }
  .ker-filter-bar { padding: .75rem 1rem; }
}

/* — Tarjeta — */
.ker-card {
  background: #fff;
  border-radius: var(--s-r-lg);
  overflow: hidden;
  box-shadow: var(--s-shadow-xs);
  border: 1.5px solid var(--s-border);
  cursor: pointer;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  transition: transform var(--s-dur) var(--s-ease),
              box-shadow var(--s-dur) var(--s-ease),
              border-color var(--s-dur);
  /* entrada animada */
  opacity: 0;
  transform: translateY(20px);
}
.ker-card.visible {
  opacity: 1;
  transform: translateY(0);
}
.ker-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--s-shadow-lg);
  border-color: var(--s-arcilla);
  text-decoration: none;
}
.ker-card[data-hidden="1"] { display: none !important; }

/* imagen */
.ker-img-wrap {
  position: relative;
  aspect-ratio: 4/5;
  overflow: hidden;
  background: linear-gradient(145deg, var(--s-crema), var(--s-crema-dk));
  flex-shrink: 0;
}
.ker-img-wrap img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s var(--s-ease);
}
.ker-card:hover .ker-img-wrap img { transform: scale(1.07); }

/* overlay hover */
.ker-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(18,18,18,.72) 0%, rgba(18,18,18,.1) 60%, transparent 100%);
  opacity: 0;
  transition: opacity var(--s-dur) var(--s-ease);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 1.2rem;
}
.ker-card:hover .ker-overlay { opacity: 1; }
.ker-overlay-btn {
  background: #fff;
  color: var(--s-terra);
  border: none;
  border-radius: var(--s-r-pill);
  padding: .55rem 1.3rem;
  font-size: .83rem;
  font-weight: 800;
  letter-spacing: .03em;
  cursor: pointer;
  transform: translateY(8px);
  transition: transform var(--s-dur) var(--s-ease), background var(--s-dur);
  pointer-events: auto;
}
.ker-card:hover .ker-overlay-btn {
  transform: translateY(0);
}
.ker-overlay-btn:hover { background: var(--s-terra); color: #fff; }

/* badge artesanal */
.ker-badge {
  position: absolute;
  top: .7rem; left: .7rem;
  background: var(--s-terra);
  color: #fff;
  font-size: .67rem;
  font-weight: 800;
  padding: .18rem .6rem;
  border-radius: var(--s-r-pill);
  letter-spacing: .07em;
  text-transform: uppercase;
  box-shadow: 0 2px 8px rgba(193,65,11,.35);
}

/* info */
.ker-info {
  padding: .9rem 1rem 1rem;
  display: flex;
  flex-direction: column;
  gap: .22rem;
  flex: 1;
}
.ker-ref {
  font-size: .66rem;
  font-weight: 800;
  color: var(--s-arcilla);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.ker-name {
  font-size: .97rem;
  font-weight: 800;
  color: var(--s-verde-osc);
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ker-short {
  font-size: .78rem;
  color: var(--s-muted);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex: 1;
  min-height: 2.24em;
}
.ker-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: .65rem;
  padding-top: .65rem;
  border-top: 1px solid var(--s-border);
}
.ker-price {
  font-size: 1.1rem;
  font-weight: 900;
  color: var(--s-terra);
  letter-spacing: -.01em;
}
.ker-cta {
  background: var(--s-terra);
  color: #fff;
  border-radius: var(--s-r-pill);
  padding: .38rem .85rem;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .02em;
  transition: background var(--s-dur);
  text-decoration: none;
}
.ker-card:hover .ker-cta { background: var(--s-terra-dk); }

/* empty state */
.ker-empty {
  grid-column: 1/-1;
  text-align: center;
  padding: 3rem;
  color: var(--s-muted);
  font-size: .95rem;
}

/* ── Mobile card horizontal (1 col) ── */
@media (max-width: 460px) {
  .ker-card { flex-direction: row; height: 110px; }
  .ker-img-wrap { aspect-ratio: unset; width: 110px; height: 110px; flex-shrink: 0; }
  .ker-badge { font-size: .6rem; padding: .14rem .5rem; }
  .ker-overlay { display: none; }
  .ker-info { padding: .65rem .8rem; gap: .15rem; }
  .ker-ref  { font-size: .62rem; }
  .ker-name { font-size: .9rem; -webkit-line-clamp: 1; }
  .ker-short{ -webkit-line-clamp: 1; min-height: 1.4em; }
  .ker-footer { margin-top: auto; }
  .ker-cta  { padding: .3rem .7rem; font-size: .72rem; }
}


/* ══════════════════════════════════════════════════════
   GALERÍA DE PRODUCTO
   ══════════════════════════════════════════════════════ */
#ker-gallery {
  font-family: system-ui, -apple-system, sans-serif;
  margin-bottom: 2rem;
}

/* layout dos columnas en desktop */
.kg-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  align-items: start;
}
@media (max-width: 820px) {
  .kg-layout { grid-template-columns: 1fr; gap: 1rem; }
}

/* columna galería */
.kg-left { position: sticky; top: 1.5rem; }

/* stage */
.kg-stage {
  position: relative;
  background: radial-gradient(ellipse at center, var(--s-crema) 0%, var(--s-crema-dk) 100%);
  border-radius: var(--s-r-lg);
  overflow: hidden;
  cursor: zoom-in;
  aspect-ratio: 1/1;
  display: flex; align-items: center; justify-content: center;
}
.kg-stage img#kg-main-img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity .22s var(--s-ease), transform .35s var(--s-ease);
}
.kg-stage img#kg-main-img.fading { opacity: 0; transform: scale(.98); }

/* flechas stage */
.kg-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(255,255,255,.92); border: none; border-radius: 50%;
  width: 42px; height: 42px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; z-index: 2; font-size: 1rem;
  box-shadow: 0 2px 12px rgba(0,0,0,.14);
  transition: background var(--s-dur), transform var(--s-dur) var(--s-ease), color var(--s-dur);
  color: var(--s-text);
}
.kg-nav:hover {
  background: var(--s-terra); color: #fff;
  transform: translateY(-50%) scale(1.08);
}
.kg-prev { left: .8rem; }
.kg-next { right: .8rem; }

/* counter */
.kg-counter {
  position: absolute; bottom: .75rem; left: 50%; transform: translateX(-50%);
  background: rgba(0,0,0,.48); color: #fff;
  font-size: .72rem; padding: .22rem .75rem; border-radius: var(--s-r-pill);
  pointer-events: none; letter-spacing: .06em;
}

/* zoom hint */
.kg-zoom-hint {
  position: absolute; top: .75rem; right: .75rem;
  background: rgba(0,0,0,.38); color: #fff;
  font-size: .7rem; padding: .2rem .6rem; border-radius: var(--s-r-pill);
  pointer-events: none; opacity: .85;
  transition: opacity .3s;
}
.kg-stage:hover .kg-zoom-hint { opacity: 0; }

/* thumbnails */
.kg-thumbs {
  display: grid;
  grid-template-columns: repeat(auto-fill, 64px);
  gap: .5rem;
  margin-top: .75rem;
}
.kg-thumb {
  width: 64px; height: 64px;
  border-radius: 8px; overflow: hidden;
  cursor: pointer;
  border: 2px solid transparent;
  transition: border-color var(--s-dur), transform var(--s-dur);
  flex-shrink: 0;
  background: var(--s-crema-dk);
}
.kg-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.kg-thumb:hover  { border-color: var(--s-arcilla); transform: scale(1.05); }
.kg-thumb.active { border-color: var(--s-terra); }

/* columna info */
.kg-right {}
.kg-prod-name {
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
  font-weight: 900;
  color: var(--s-verde-osc);
  margin: 0 0 .2rem;
  letter-spacing: -.02em;
  line-height: 1.2;
}
.kg-prod-ref {
  font-size: .75rem; font-weight: 700;
  color: var(--s-arcilla); letter-spacing: .09em; text-transform: uppercase;
  margin-bottom: .6rem;
}
.kg-prod-price {
  font-size: 2rem; font-weight: 900;
  color: var(--s-terra); letter-spacing: -.02em;
  margin-bottom: 1rem;
}
.kg-badges-row {
  display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1.2rem;
}
.kg-badge {
  background: var(--s-terra-cl); color: var(--s-terra);
  border: 1px solid rgba(193,65,11,.2);
  border-radius: var(--s-r-pill); padding: .28rem .75rem;
  font-size: .73rem; font-weight: 700; letter-spacing: .04em;
}
.kg-badge.verde {
  background: var(--s-verde-cl); color: var(--s-verde);
  border-color: rgba(45,122,58,.2);
}
.kg-divider { border: none; border-top: 1px solid var(--s-border); margin: 1rem 0; }
.kg-desc {
  font-size: .875rem; color: var(--s-muted); line-height: 1.65;
  margin-bottom: 1.2rem;
}
.kg-wa-btn {
  display: flex; align-items: center; gap: .6rem; justify-content: center;
  background: #25d366; color: #fff !important; text-decoration: none !important;
  border: none; border-radius: var(--s-r-pill);
  padding: .85rem 1.5rem; font-weight: 800; font-size: .95rem;
  width: 100%; cursor: pointer;
  transition: background var(--s-dur), transform var(--s-dur);
  box-shadow: 0 4px 18px rgba(37,211,102,.3);
  letter-spacing: .01em;
}
.kg-wa-btn:hover { background: #1da851; transform: translateY(-2px); box-shadow: 0 6px 24px rgba(37,211,102,.4); }
.kg-seal {
  display: flex; align-items: center; justify-content: center; gap: .4rem;
  background: var(--s-verde-cl); color: var(--s-verde);
  border: 1px solid rgba(45,122,58,.2);
  border-radius: var(--s-r-pill); padding: .35rem 1rem;
  font-size: .75rem; font-weight: 700; letter-spacing: .04em;
  margin-top: .6rem;
  text-align: center;
}


/* ══════════════════════════════════════════════════════
   LIGHTBOX
   ══════════════════════════════════════════════════════ */
#ker-lightbox {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.93);
  z-index: 99999;
  display: flex; align-items: center; justify-content: center;
  animation: klbFade .18s ease;
}
@keyframes klbFade { from { opacity:0 } to { opacity:1 } }
#ker-lightbox .klb-img-wrap {
  max-width: 90vw; max-height: 90vh;
  display: flex; align-items: center; justify-content: center;
}
#ker-lightbox .klb-img-wrap img {
  max-width: 88vw; max-height: 88vh;
  object-fit: contain;
  border-radius: var(--s-r);
  box-shadow: 0 24px 80px rgba(0,0,0,.5);
  display: block;
  animation: klbPop .2s var(--s-ease);
}
@keyframes klbPop { from { transform: scale(.95); opacity:0 } to { transform: scale(1); opacity:1 } }
.klb-close {
  position: fixed; top: 1.25rem; right: 1.5rem;
  background: rgba(255,255,255,.14); border: none; color: #fff;
  font-size: 1.3rem; width: 44px; height: 44px; border-radius: 50%;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background var(--s-dur);
}
.klb-close:hover { background: rgba(255,255,255,.28); }
.klb-nav {
  position: fixed; top: 50%; transform: translateY(-50%);
  background: rgba(255,255,255,.1); border: none; color: #fff;
  font-size: 1.5rem; width: 52px; height: 52px; border-radius: 50%;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background var(--s-dur);
}
.klb-nav:hover { background: rgba(255,255,255,.25); }
.klb-prev { left: 1.25rem; }
.klb-next { right: 1.25rem; }
.klb-counter {
  position: fixed; bottom: 1.5rem; left: 50%; transform: translateX(-50%);
  color: rgba(255,255,255,.65); font-size: .82rem; letter-spacing: .08em;
}

/* BiBoske - capa maestra UX/UI */
:root {
  --s-verde: #0f6b39;
  --s-verde-osc: #07331f;
  --s-verde-cl: #edf5ea;
  --s-lima: #bacd42;
  --s-terra: #a65032;
  --s-terra-dk: #753520;
  --s-terra-cl: #f7ebe4;
  --s-arcilla: #b97852;
  --s-crema: #fbf8f1;
  --s-crema-dk: #eadfce;
  --s-text: #172018;
  --s-muted: #566053;
  --s-border: #ded6c9;
  --bb-paper: #fbf8f1;
  --bb-white: #fffdf8;
  --bb-radius: 32px;
}

html {
  scroll-behavior: smooth;
}

body,
#san-catalog,
#ker-catalog,
#caf-page {
  color: var(--s-text) !important;
  font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  background: var(--bb-paper) !important;
}

#san-catalog p,
#ker-catalog p,
#caf-page p {
  color: inherit;
  font-size: .98rem;
  line-height: 1.68;
}

#san-catalog h1,
#san-catalog h2,
#san-catalog h3,
#ker-catalog h1,
#ker-catalog h2,
#ker-catalog h3,
#caf-page h1,
#caf-page h2,
#caf-page h3 {
  color: inherit;
  letter-spacing: 0;
}

#san-catalog .san-section-label,
#san-catalog .san-blog-ey,
#ker-catalog .ker-ref,
#caf-page .caf-s3-label,
#caf-page .caf-s4-label,
#caf-page .caf-s6-eyebrow {
  color: var(--s-terra) !important;
  font-size: .68rem !important;
  font-weight: 800 !important;
  letter-spacing: .14em !important;
}

/* Cafe: story first, image as atmosphere */
#caf-page {
  overflow: hidden;
}

#caf-page .caf-s1 {
  height: clamp(500px, 64svh, 660px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  isolation: isolate;
  border-radius: 0 0 var(--bb-radius) var(--bb-radius);
  background: var(--s-verde-osc) !important;
}

#caf-page .caf-s1-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 45% !important;
  filter: saturate(.72) contrast(.94) brightness(.72) !important;
  transform: scale(1.02);
}

#caf-page .caf-s1-ovl {
  background:
    linear-gradient(90deg, rgba(7, 31, 20, .9) 0%, rgba(7, 31, 20, .73) 43%, rgba(7, 31, 20, .36) 68%, rgba(7, 31, 20, .54) 100%),
    linear-gradient(180deg, rgba(7, 31, 20, .16) 0%, rgba(7, 31, 20, .78) 100%) !important;
}

#caf-page .caf-s1-brand {
  left: clamp(1.5rem, 5vw, 4.6rem) !important;
  bottom: clamp(2.5rem, 8vh, 5rem) !important;
  max-width: min(92vw, 650px);
  padding: 0 !important;
  gap: 0;
}

#caf-page .caf-s1-atasim {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(4rem, 9vw, 7.8rem) !important;
  font-weight: 300 !important;
  line-height: .82 !important;
  letter-spacing: .05em !important;
  text-shadow: 0 16px 42px rgba(0, 0, 0, .34);
}

#caf-page .caf-s1-coffee {
  color: var(--s-lima) !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(1.25rem, 2.3vw, 2rem) !important;
  line-height: 1.1 !important;
  margin: .15rem 0 1.15rem !important;
  opacity: .94 !important;
}

#caf-page .caf-s1-story {
  max-width: 560px;
  margin: 0 0 1rem !important;
  color: rgba(255, 253, 248, .92) !important;
  font-size: clamp(.95rem, 1.25vw, 1.08rem) !important;
  line-height: 1.62 !important;
}

#caf-page .caf-s1-points {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin: 0 0 1.25rem;
}

#caf-page .caf-s1-points span {
  border: 1px solid rgba(255, 253, 248, .28);
  border-radius: 999px;
  color: rgba(255, 253, 248, .86);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .06em;
  padding: .42rem .72rem;
  text-transform: uppercase;
}

#caf-page .caf-s1-cta,
#caf-page .caf-s6-btn {
  width: fit-content;
  background: var(--s-lima) !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: 0 14px 34px rgba(7, 51, 31, .22) !important;
  color: #102417 !important;
  font-weight: 800 !important;
  padding: .82rem 1.45rem !important;
}

#caf-page .caf-s1-cta:hover,
#caf-page .caf-s6-btn:hover {
  background: #d0df63 !important;
  color: #102417 !important;
}

#caf-page .caf-s1-footer {
  bottom: 2rem !important;
  right: clamp(1.25rem, 4vw, 3rem) !important;
  max-width: 390px;
}

#caf-page .caf-s1-loc,
#caf-page .caf-s1-badge {
  color: rgba(255, 253, 248, .72) !important;
}

#caf-page .caf-s2 {
  background: var(--bb-paper) !important;
  border-bottom: 1px solid var(--s-border) !important;
  gap: clamp(2rem, 5vw, 5rem) !important;
  padding: clamp(4rem, 7vw, 7rem) clamp(1.5rem, 5vw, 4rem) !important;
}

#caf-page .caf-s2-quote {
  border-left-color: var(--s-lima) !important;
  color: var(--s-verde-osc) !important;
}

#caf-page .caf-s2-right {
  border-left-color: var(--s-border) !important;
}

#caf-page .caf-s2-n,
#caf-page .caf-s3-h2,
#caf-page .caf-s6-h2 {
  color: var(--s-verde-osc) !important;
}

#caf-page .caf-s2-sub,
#caf-page .caf-s2-unit,
#caf-page .caf-s6-contact {
  color: var(--s-muted) !important;
}

#caf-page .caf-s3 {
  max-width: 1180px;
  margin: clamp(2rem, 4.5vw, 4rem) auto;
  overflow: hidden;
  background: var(--bb-white) !important;
  border: 1px solid var(--s-border) !important;
  border-radius: var(--bb-radius);
  box-shadow: 0 24px 60px rgba(7, 51, 31, .08);
}

#caf-page .caf-s3-img,
#caf-page .caf-s3-body {
  background: var(--bb-white) !important;
}

#caf-page .caf-s3-img {
  background:
    radial-gradient(circle at 50% 38%, rgba(186, 205, 66, .18), transparent 38%),
    linear-gradient(145deg, #f7f1e8, #ede4d7) !important;
}

#caf-page .caf-s3-specs {
  border-color: var(--s-border) !important;
  border-radius: 16px !important;
}

#caf-page .caf-s3-specs > div {
  border-color: var(--s-border) !important;
}

#caf-page .caf-s3-price {
  color: var(--s-verde) !important;
}

#caf-page .caf-s3-btn {
  background: var(--s-verde) !important;
  border-radius: 999px !important;
  box-shadow: 0 16px 36px rgba(7, 51, 31, .18) !important;
}

#caf-page .caf-s3-btn:hover {
  background: var(--s-verde-osc) !important;
}

#caf-page .caf-s4 {
  margin-top: clamp(2rem, 4vw, 4rem);
  background:
    radial-gradient(circle at 88% 10%, rgba(186, 205, 66, .15), transparent 28%),
    var(--s-verde-osc) !important;
  border-radius: var(--bb-radius) var(--bb-radius) 0 0;
}

#caf-page .caf-s4-h2 {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  color: #fffdf8 !important;
}

#caf-page .caf-s4-n {
  color: rgba(186, 205, 66, .24) !important;
}

#caf-page .caf-s5 {
  background: var(--s-verde) !important;
}

#caf-page .caf-s6 {
  background: var(--bb-paper) !important;
  padding: clamp(4.5rem, 7vw, 7rem) 1.5rem !important;
}

/* Infusiones: editorial, calm and legible */
#san-catalog .san-hero {
  min-height: clamp(500px, 64svh, 680px) !important;
  border-radius: 0 0 var(--bb-radius) var(--bb-radius);
  background:
    radial-gradient(circle at 82% 18%, rgba(186, 205, 66, .15), transparent 30%),
    linear-gradient(135deg, #062717 0%, var(--s-verde-osc) 58%, #0b4329 100%) !important;
}

#san-catalog .san-hero-brand {
  max-width: 740px;
}

#san-catalog .san-hero-main {
  font-size: clamp(4rem, 9vw, 8rem) !important;
  letter-spacing: .05em !important;
}

#san-catalog .san-hero-xtra,
#san-catalog .san-hero-badge {
  color: var(--s-lima) !important;
}

#san-catalog .san-hero-desc {
  color: rgba(255, 253, 248, .82) !important;
  font-size: 1rem !important;
  line-height: 1.7 !important;
}

#san-catalog .san-values,
#san-catalog .san-proceso,
#san-catalog .san-grid-wrap {
  background: var(--bb-paper) !important;
}

#san-catalog .san-card,
#san-catalog .san-bcard {
  border-color: var(--s-border) !important;
  box-shadow: 0 14px 34px rgba(7, 51, 31, .07) !important;
}

#san-catalog .san-bcard {
  --bcard-acc: var(--s-lima) !important;
}

#san-catalog .san-blog,
#san-catalog .san-cta-bar {
  background: var(--s-verde-osc) !important;
}

#san-catalog .san-cta-wa {
  background: var(--s-lima) !important;
  border-radius: 999px !important;
  color: #102417 !important;
}

/* Ceramica: material warmth inside the global system */
#ker-catalog .ker-header-bar {
  padding: clamp(2.4rem, 5vw, 4rem) 1.5rem clamp(2.2rem, 4vw, 3rem) !important;
  background:
    radial-gradient(circle at 85% 15%, rgba(186, 205, 66, .14), transparent 26%),
    linear-gradient(135deg, #07331f 0%, #12482c 58%, #1d5b35 100%) !important;
  border-radius: 0 0 var(--bb-radius) var(--bb-radius);
}

#ker-catalog .ker-header-bar h2 {
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: clamp(1.8rem, 3.4vw, 3rem) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
}

#ker-catalog .ker-header-bar p {
  color: rgba(255, 253, 248, .74) !important;
  font-size: .98rem !important;
}

#ker-catalog .ker-filter-bar {
  background: rgba(255, 253, 248, .96) !important;
  border-bottom-color: var(--s-border) !important;
  box-shadow: 0 12px 26px rgba(7, 51, 31, .06) !important;
}

#ker-catalog .ker-filter-btn {
  background: #fffdf8 !important;
  border-color: var(--s-border) !important;
  color: var(--s-muted) !important;
}

#ker-catalog .ker-filter-btn:hover,
#ker-catalog .ker-filter-btn.active {
  background: var(--s-terra) !important;
  border-color: var(--s-terra) !important;
  color: #fff !important;
}

#ker-catalog .ker-card {
  background: #fffdf8 !important;
  border-color: var(--s-border) !important;
  box-shadow: 0 14px 34px rgba(7, 51, 31, .07) !important;
}

#ker-catalog .ker-card:hover {
  border-color: rgba(166, 80, 50, .62) !important;
  box-shadow: 0 24px 54px rgba(7, 51, 31, .14) !important;
}

#ker-catalog .ker-img-wrap {
  background:
    radial-gradient(circle at 50% 28%, rgba(186, 205, 66, .1), transparent 32%),
    linear-gradient(145deg, #f4efe6, #e8dece) !important;
}

@media (max-width: 900px) {
  #caf-page .caf-s1 {
    height: 610px !important;
  }

  #caf-page .caf-s1-brand {
    left: 1.25rem !important;
    right: 1.25rem !important;
    bottom: 2rem !important;
    max-width: none;
  }

  #caf-page .caf-s1-footer {
    display: none !important;
  }

  #caf-page .caf-s1-atasim {
    font-size: clamp(3.4rem, 17vw, 5rem) !important;
  }

  #caf-page .caf-s1-story {
    font-size: .95rem !important;
  }

  #caf-page .caf-s2,
  #caf-page .caf-s3 {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  #caf-page .caf-s3 {
    border-radius: 24px;
  }

  #san-catalog .san-hero-main {
    font-size: clamp(3.2rem, 15vw, 5rem) !important;
  }
}

@media (max-width: 620px) {
  #caf-page .caf-s1 {
    height: 640px !important;
    border-radius: 0 0 24px 24px;
  }

  #caf-page .caf-s1-img {
    object-position: 58% center !important;
  }

  #caf-page .caf-s1-points {
    gap: .45rem;
  }

  #caf-page .caf-s1-points span {
    font-size: .64rem;
    padding: .36rem .58rem;
  }

  #caf-page .caf-s3-img {
    min-height: 300px !important;
    padding: 2.3rem 1.75rem !important;
  }

  #caf-page .caf-s3-body {
    padding: 2.2rem 1.4rem !important;
  }

  #san-catalog .san-hero,
  #ker-catalog .ker-header-bar {
    border-radius: 0 0 24px 24px;
  }

  #san-catalog .san-hero {
    min-height: 520px !important;
  }
}

/* BiBoske Studio System v4 - final responsive polish */
#caf-page,
#san-catalog,
#ker-catalog {
  max-width: 100% !important;
  overflow-x: hidden !important;
}

#caf-page .caf-s1-brand {
  box-sizing: border-box !important;
  width: min(650px, calc(100vw - clamp(3rem, 10vw, 9rem))) !important;
}

#caf-page .caf-s1-story,
#ker-catalog .bb-hero-text,
#san-catalog .bb-hero-text,
#san-catalog .san-hero-desc {
  color: #fffdf8 !important;
  overflow-wrap: anywhere !important;
  text-shadow: 0 10px 28px rgba(0, 0, 0, .32) !important;
}

#caf-page .caf-s1-story {
  width: 100% !important;
  max-width: 560px !important;
}

.bb-hero-shade {
  background:
    linear-gradient(90deg, rgba(4, 24, 14, .96) 0%, rgba(4, 24, 14, .84) 45%, rgba(4, 24, 14, .54) 69%, rgba(4, 24, 14, .74) 100%),
    linear-gradient(180deg, rgba(4, 24, 14, .22) 0%, rgba(4, 24, 14, .88) 100%) !important;
}

.bb-hero--ceramica .bb-hero-product {
  background: rgba(255, 253, 248, .94) !important;
}

.bb-hero--ceramica .bb-hero-product img {
  height: 340px !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center 68% !important;
}

.bb-hero--infusiones .bb-hero-product img {
  height: 248px !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
}

#sanate-whatsapp .wa-btn {
  box-shadow: 0 18px 42px rgba(7, 51, 31, .22) !important;
}

@media (max-width: 900px) {
  #caf-page .caf-s1-brand {
    width: calc(100vw - 2.5rem) !important;
    max-width: calc(100vw - 2.5rem) !important;
  }

  #caf-page .caf-s1-story {
    max-width: 100% !important;
    white-space: normal !important;
  }

  .bb-hero {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
    padding: 4rem 1.25rem 2.4rem !important;
  }

  .bb-hero-copy,
  #san-catalog .san-hero-brand {
    width: 100% !important;
    max-width: 100% !important;
  }

  .bb-hero-product {
    justify-self: start !important;
    width: min(360px, 100%) !important;
  }
}

@media (max-width: 620px) {
  #caf-page .caf-s1 {
    min-height: 640px !important;
    height: auto !important;
  }

  #caf-page .caf-s1-brand {
    left: 1.25rem !important;
    right: 1.25rem !important;
    bottom: 1.9rem !important;
    width: calc(100vw - 2.5rem) !important;
    max-width: calc(100vw - 2.5rem) !important;
  }

  #caf-page .caf-s1-atasim {
    font-size: clamp(3.25rem, 16vw, 4.35rem) !important;
  }

  #caf-page .caf-s1-story {
    font-size: .94rem !important;
    line-height: 1.58 !important;
    max-width: 100% !important;
  }

  #caf-page .caf-s1-points {
    max-width: 100% !important;
  }

  #caf-page .caf-s1-points span {
    white-space: nowrap !important;
  }

  .bb-hero-title,
  #san-catalog .san-hero-main {
    font-size: clamp(3rem, 14vw, 4.4rem) !important;
    letter-spacing: .02em !important;
  }

  #ker-catalog .ker-header-bar .bb-hero-title {
    font-size: clamp(2.7rem, 13vw, 4rem) !important;
  }

  .bb-hero-product,
  #san-catalog .san-hero-foot {
    display: none !important;
  }

  #sanate-whatsapp {
    bottom: .9rem !important;
    right: .9rem !important;
  }
}

/* Mobile text guard: avoid legacy fixed-width hero copy */
@media (max-width: 620px) {
  html,
  body,
  #wrapper,
  #content-wrapper,
  #main,
  #caf-page {
    overflow-x: hidden !important;
  }

  body #caf-page .caf-s1-brand {
    left: 1.25rem !important;
    right: 1.25rem !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  body #caf-page .caf-s1-brand > *,
  body #caf-page .caf-s1-story {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  body #caf-page .caf-s1-story {
    display: block !important;
    width: min(100%, 17rem) !important;
    max-width: 17rem !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    overflow: visible !important;
  }
}

/* ============================================================
   BiBoske Studio System v3
   Sistema premium final: origen, cultura, producto y claridad.
   ============================================================ */
:root {
  --bb-forest: #062f1d;
  --bb-forest-2: #0b4a2b;
  --bb-forest-soft: #eff6ec;
  --bb-ivory: #fbf7ed;
  --bb-ivory-2: #f3eadc;
  --bb-gold: #c7b24a;
  --bb-gold-2: #e0d36a;
  --bb-terra: #9f5137;
  --bb-terra-dark: #713521;
  --bb-charcoal: #101611;
  --bb-muted: #495348;
  --bb-line: #ded3c2;
  --bb-radius-xl: 30px;
  --bb-radius-lg: 18px;
  --bb-shadow-soft: 0 18px 54px rgba(6, 47, 29, .11);
  --bb-shadow-deep: 0 28px 88px rgba(6, 47, 29, .22);
}

body {
  background: var(--bb-ivory) !important;
  color: var(--bb-charcoal) !important;
  font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  letter-spacing: 0 !important;
}

#caf-page,
#san-catalog,
#ker-catalog {
  background: var(--bb-ivory) !important;
  color: var(--bb-charcoal) !important;
  font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

#caf-page h1,
#caf-page h2,
#san-catalog h1,
#san-catalog h2,
#ker-catalog h1,
#ker-catalog h2,
.bb-hero-title {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

#caf-page h3,
#san-catalog h3,
#ker-catalog h3,
#caf-page p,
#san-catalog p,
#ker-catalog p,
#caf-page a,
#san-catalog a,
#ker-catalog a,
#caf-page button,
#san-catalog button,
#ker-catalog button {
  font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  letter-spacing: 0 !important;
}

#caf-page p,
#san-catalog p,
#ker-catalog p {
  color: var(--bb-muted) !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
}

/* Heroes: mismo sistema, distinta historia */
#caf-page .caf-s1,
#san-catalog .san-hero.bb-hero,
#ker-catalog .ker-header-bar.bb-hero {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .72fr) !important;
  align-items: center !important;
  gap: 2.5rem !important;
  min-height: 560px !important;
  width: 100% !important;
  padding: 4.2rem 4.25rem !important;
  overflow: hidden !important;
  isolation: isolate !important;
  border-radius: 0 0 var(--bb-radius-xl) var(--bb-radius-xl) !important;
  background: var(--bb-forest) !important;
  text-align: left !important;
}

.bb-hero-bg,
#caf-page .caf-s1-img {
  position: absolute !important;
  inset: 0 !important;
  z-index: -3 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  filter: saturate(.72) contrast(.98) brightness(.72) !important;
}

.bb-hero--infusiones .bb-hero-bg {
  object-position: center center !important;
}

.bb-hero--ceramica .bb-hero-bg {
  object-position: center 45% !important;
}

.bb-hero-shade,
#caf-page .caf-s1-ovl {
  position: absolute !important;
  inset: 0 !important;
  z-index: -2 !important;
  background:
    linear-gradient(90deg, rgba(6, 47, 29, .96) 0%, rgba(6, 47, 29, .86) 39%, rgba(6, 47, 29, .52) 68%, rgba(6, 47, 29, .74) 100%),
    radial-gradient(circle at 82% 22%, rgba(199, 178, 74, .18), transparent 30%) !important;
}

.bb-hero-copy,
#caf-page .caf-s1-brand,
#san-catalog .san-hero-brand {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 2 !important;
  max-width: 650px !important;
  padding: 0 !important;
}

.bb-hero-kicker,
#caf-page .caf-s3-label,
#caf-page .caf-s4-label,
#san-catalog .san-section-label,
#san-catalog .san-blog-ey,
#ker-catalog .ker-ref {
  display: inline-block !important;
  margin-bottom: .9rem !important;
  color: var(--bb-gold-2) !important;
  font-size: .74rem !important;
  font-weight: 800 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

.bb-hero-title,
#caf-page .caf-s1-atasim,
#san-catalog .san-hero-main {
  display: block !important;
  color: #fffdf8 !important;
  font-size: 6.8rem !important;
  line-height: .88 !important;
  text-shadow: 0 18px 52px rgba(0, 0, 0, .3) !important;
}

.bb-hero-title span,
#ker-catalog .ker-header-bar h2 span,
#san-catalog .san-hero-xtra,
#caf-page .caf-s1-coffee {
  color: var(--bb-gold-2) !important;
}

#ker-catalog .ker-header-bar .bb-hero-title {
  font-size: 4.9rem !important;
  max-width: 720px !important;
}

#san-catalog .san-hero-xtra,
#caf-page .caf-s1-coffee {
  display: block !important;
  margin: .2rem 0 1.15rem !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: 1.85rem !important;
  font-style: italic !important;
  line-height: 1 !important;
}

.bb-hero-text,
#caf-page .caf-s1-story,
#san-catalog .san-hero-desc,
#ker-catalog .ker-header-bar p {
  max-width: 560px !important;
  margin: 0 0 1.15rem !important;
  color: #fffdf8 !important;
  font-size: 1.04rem !important;
  line-height: 1.7 !important;
}

.bb-hero-pills,
#caf-page .caf-s1-points,
#san-catalog .san-hero-pills {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .6rem !important;
  margin: 0 0 1.35rem !important;
}

.bb-hero-pills span,
#caf-page .caf-s1-points span,
#san-catalog .san-hero-pills span {
  border: 1px solid rgba(255, 253, 248, .32) !important;
  border-radius: 999px !important;
  background: rgba(255, 253, 248, .06) !important;
  color: #fffdf8 !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  padding: .48rem .78rem !important;
  text-transform: uppercase !important;
}

.bb-hero-cta,
#caf-page .caf-s1-cta,
#caf-page .caf-s6-btn,
#san-catalog .san-cta-wa {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 46px !important;
  width: fit-content !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--bb-gold-2) !important;
  color: #102417 !important;
  font-size: .88rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  padding: .9rem 1.35rem !important;
  text-decoration: none !important;
  box-shadow: 0 16px 38px rgba(6, 47, 29, .26) !important;
}

.bb-hero-cta:hover,
#caf-page .caf-s1-cta:hover,
#caf-page .caf-s6-btn:hover,
#san-catalog .san-cta-wa:hover {
  background: #eee07a !important;
  color: #102417 !important;
  transform: translateY(-1px);
}

.bb-hero-product {
  position: relative !important;
  z-index: 2 !important;
  justify-self: end !important;
  width: min(390px, 100%) !important;
  margin: 0 !important;
  padding: 1.15rem !important;
  border: 1px solid rgba(255, 253, 248, .2) !important;
  border-radius: 24px !important;
  background: rgba(255, 253, 248, .92) !important;
  box-shadow: var(--bb-shadow-deep) !important;
}

.bb-hero-product img {
  display: block !important;
  width: 100% !important;
  max-height: 360px !important;
  object-fit: contain !important;
  border-radius: 18px !important;
  filter: saturate(.82) contrast(.98) sepia(.04) !important;
}

.bb-hero-product figcaption {
  margin-top: .9rem !important;
  color: var(--bb-charcoal) !important;
  font-size: .76rem !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  line-height: 1.3 !important;
  text-align: center !important;
  text-transform: uppercase !important;
}

#caf-page .caf-s1-footer,
#san-catalog .san-hero-foot {
  position: absolute !important;
  right: 3rem !important;
  bottom: 2rem !important;
  z-index: 3 !important;
}

#caf-page .caf-s1-loc,
#caf-page .caf-s1-badge,
#san-catalog .san-hero-loc,
#san-catalog .san-hero-badge {
  color: rgba(255, 253, 248, .74) !important;
}

/* Ritmo editorial */
#caf-page .caf-s2,
#san-catalog .san-values,
#san-catalog .san-proceso,
#san-catalog .san-grid-wrap,
#ker-catalog .ker-grid-wrap {
  background: var(--bb-ivory) !important;
}

#caf-page .caf-s4,
#san-catalog .san-blog,
#san-catalog .san-cta-bar {
  background:
    radial-gradient(circle at 84% 12%, rgba(199, 178, 74, .14), transparent 28%),
    var(--bb-forest) !important;
}

/* Tarjetas y catalogos */
.san-card,
.san-bcard,
.ker-card,
#caf-page .caf-s3 {
  border: 1px solid var(--bb-line) !important;
  border-radius: 18px !important;
  background: var(--bb-white, #fffdf8) !important;
  box-shadow: var(--bb-shadow-soft) !important;
}

.san-card:hover,
.san-bcard:hover,
.ker-card:hover {
  border-color: rgba(159, 81, 55, .48) !important;
  box-shadow: 0 24px 64px rgba(6, 47, 29, .16) !important;
}

.san-img-wrap img,
.ker-img-wrap img,
#caf-page .caf-s3-img img {
  filter: saturate(.8) contrast(.98) sepia(.04) !important;
}

.san-name,
.ker-name,
#caf-page .caf-s3-h2,
#san-catalog .san-blog-title,
#caf-page .caf-s4-h2,
#caf-page .caf-s6-h2 {
  color: var(--bb-charcoal) !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

.san-desc,
.ker-short,
.san-bcard-body p,
#caf-page .caf-s2-sub,
#caf-page .caf-s4-body p {
  color: var(--bb-muted) !important;
}

.san-price,
.ker-price,
#caf-page .caf-s3-price {
  color: var(--bb-forest) !important;
}

.san-cta,
.ker-cta,
#caf-page .caf-s3-btn,
.kg-wa-btn {
  border-radius: 999px !important;
  background: var(--bb-forest-2) !important;
  color: #fffdf8 !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-weight: 900 !important;
}

.ker-badge,
.san-badge-pill {
  background: var(--bb-terra) !important;
  color: #fffdf8 !important;
}

#sanate-whatsapp .wa-btn {
  background: #128c4a !important;
  color: #fffdf8 !important;
  box-shadow: 0 16px 42px rgba(6, 47, 29, .22) !important;
}

/* Home: bajar sensacion de promo generica */
.page-index .mi-slider-container {
  background: var(--bb-forest) !important;
  box-shadow: var(--bb-shadow-soft) !important;
}

.page-index .mi-slider-container .btn-naranja,
.page-index .mi-slider-container .elementor-button {
  background: var(--bb-gold-2) !important;
  color: #102417 !important;
  border-radius: 999px !important;
}

@media (max-width: 900px) {
  #caf-page .caf-s1,
  #san-catalog .san-hero.bb-hero,
  #ker-catalog .ker-header-bar.bb-hero {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
    min-height: 670px !important;
    padding: 2.5rem 1.25rem 1.25rem !important;
    gap: 1.15rem !important;
    border-radius: 0 0 24px 24px !important;
  }

  .bb-hero-title,
  #caf-page .caf-s1-atasim,
  #san-catalog .san-hero-main {
    font-size: 4.2rem !important;
    line-height: .9 !important;
  }

  #ker-catalog .ker-header-bar .bb-hero-title {
    font-size: 3.25rem !important;
  }

  .bb-hero-text,
  #caf-page .caf-s1-story,
  #san-catalog .san-hero-desc,
  #ker-catalog .ker-header-bar p {
    font-size: .96rem !important;
    line-height: 1.58 !important;
  }

  .bb-hero-product {
    width: min(270px, 82vw) !important;
    align-self: center !important;
    padding: .8rem !important;
  }

  .bb-hero-product img {
    max-height: 210px !important;
  }

  #caf-page .caf-s1-footer,
  #san-catalog .san-hero-foot {
    display: none !important;
  }
}

@media (max-width: 620px) {
  #caf-page .caf-s1,
  #san-catalog .san-hero.bb-hero,
  #ker-catalog .ker-header-bar.bb-hero {
    min-height: 720px !important;
  }

  .bb-hero-product {
    width: min(240px, 80vw) !important;
  }

  .bb-hero-pills span,
  #caf-page .caf-s1-points span,
  #san-catalog .san-hero-pills span {
    font-size: .64rem !important;
    padding: .4rem .58rem !important;
  }

  #sanate-whatsapp .wa-label {
    display: none !important;
  }
}

/* Limpieza UX: sin popup invasivo ni flotantes duplicados */
body > div[style*="position: fixed"][style*="bottom"][style*="right"]:not(#sanate-whatsapp),
body > div[style*="position:fixed"][style*="bottom"][style*="right"]:not(#sanate-whatsapp),
body > section[style*="position: fixed"][style*="bottom"][style*="right"],
body > section[style*="position:fixed"][style*="bottom"][style*="right"],
body > iframe[style*="position: fixed"][style*="bottom"][style*="right"],
body > iframe[style*="position:fixed"][style*="bottom"][style*="right"],
body > div[class*="newsletter" i][style*="fixed"],
body > div[class*="popup" i][style*="fixed"],
body > div[id*="newsletter" i][style*="fixed"],
body > div[id*="popup" i][style*="fixed"] {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

#sanate-whatsapp {
  right: 1rem !important;
  bottom: 1rem !important;
}

@media (max-width: 620px) {
  .elementor-element-db23af8 .elementor-testimonial-name,
  .elementor-element-22b6ec5 .elementor-testimonial-name,
  .elementor-widget-testimonial-carousel .elementor-testimonial-name {
    max-width: calc(100vw - 2rem) !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.35 !important;
    padding: .48rem .85rem !important;
    text-align: center !important;
  }

  .elementor-element-db23af8,
  .elementor-element-22b6ec5 {
    height: auto !important;
    min-height: 34px !important;
  }

  #sanate-whatsapp .wa-label {
    display: none !important;
  }

  #sanate-whatsapp .wa-btn {
    width: 52px !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    justify-content: center !important;
  }
}

/* Creative Popup desactivado visualmente: evita cupón invasivo en catálogo */
.cp-popup,
.cp-ps-container,
#cp_1,
.cp-popup-wrapper,
.cp-overlay,
.cp-container,
.cp-close {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 620px) {
  .elementor-element-db23af8,
  .elementor-element-db23af8 .elementor-widget-container,
  .elementor-element-db23af8 .elementor-carousel-wrapper,
  .elementor-element-db23af8 .swiper-wrapper,
  .elementor-element-db23af8 .swiper-slide,
  .elementor-element-db23af8 .elementor-testimonial-wrapper,
  .elementor-element-db23af8 .elementor-testimonial-meta,
  .elementor-element-db23af8 .elementor-testimonial-meta-inner,
  .elementor-element-db23af8 .elementor-testimonial-details {
    display: block !important;
    width: 100% !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    height: auto !important;
    transform: none !important;
    overflow: visible !important;
  }

  .elementor-element-db23af8 .elementor-testimonial-name {
    display: block !important;
    width: 100% !important;
    max-width: calc(100vw - 1.25rem) !important;
    margin: 0 auto !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.35 !important;
    font-size: .82rem !important;
    text-align: center !important;
  }

  .elementor-element-db23af8 .elementor-testimonial-name {
    font-size: 0 !important;
  }

  .elementor-element-db23af8 .elementor-testimonial-name::after {
    content: "5% OFF en tu primera compra";
    display: inline-block;
    color: #fffdf8;
    font-size: .82rem !important;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: 0;
  }
}

/* ============================================================
   BiBoske / Sanate - capa de refinamiento premium
   Conserva menu, navegacion, URLs y footer. Solo eleva contraste,
   ritmo visual, profundidad cromatica y lectura.
   ============================================================ */
:root {
  --s-verde: #0f6b39;
  --s-verde-osc: #07331f;
  --s-verde-cl: #edf5ea;
  --s-lima: #b7c83a;
  --s-terra: #a65032;
  --s-terra-dk: #753520;
  --s-terra-cl: #f7ebe4;
  --s-arcilla: #b97852;
  --s-crema: #f6f0e7;
  --s-crema-dk: #e8dece;
  --s-text: #172018;
  --s-muted: #596256;
  --s-border: #ded6c9;
  --s-shadow-xs: 0 1px 3px rgba(7, 51, 31, .07);
  --s-shadow-sm: 0 8px 22px rgba(7, 51, 31, .09);
  --s-shadow: 0 18px 48px rgba(7, 51, 31, .13);
  --s-shadow-lg: 0 26px 70px rgba(7, 51, 31, .18);
}

html {
  scroll-behavior: smooth;
}

body {
  background: #fbf8f1 !important;
  color: var(--s-text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body,
button,
input,
select,
textarea {
  letter-spacing: 0;
}

.page-index #content,
.page-category #content,
.page-product #content {
  background: linear-gradient(180deg, #fbf8f1 0%, #f6f0e7 100%);
}

.header-banner {
  display: none !important;
}

.elementor-heading-title,
.product-title,
.product-miniature .product-title a,
.page-header h1,
h1,
h2,
h3 {
  color: var(--s-text);
}

p,
.elementor-text-editor,
.product-description,
.fs-desc,
.san-desc,
.ker-short {
  color: var(--s-muted);
}

/* Header visual polish: same structure, calmer surface */
.header,
body .elementor[data-elementor-type="header"],
body header.header {
  background: rgba(251, 248, 241, .96);
}

.header .elementor-section,
.header .elementor-column-wrap,
.header .elementor-widget-wrap {
  transition: background-color .24s var(--s-ease), box-shadow .24s var(--s-ease);
}

.elementor-search__container {
  background: rgba(255, 255, 255, .84) !important;
  border: 1px solid rgba(7, 51, 31, .12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65);
}

.elementor-search__input,
.elementor-search__input::placeholder {
  color: rgba(23, 32, 24, .58) !important;
}

.ets_mm_megamenu .mm_menus_li > a,
.ets_mm_megamenu .mm_menu_content_title {
  color: var(--s-text) !important;
  font-weight: 600 !important;
}

.ets_mm_megamenu .mm_menus_li:hover > a,
.ets_mm_megamenu .mm_menus_li:hover .mm_menu_content_title {
  color: var(--s-verde) !important;
}

/* Hero: same slider, more editorial and legible */
.page-index .mi-slider-container {
  width: min(94vw, 1286px) !important;
  min-height: 540px;
  margin: 1.35rem auto 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 30px 80px rgba(7, 25, 14, .18) !important;
  background: #071b11;
}

.page-index .mi-slider-container .swiper-slide {
  height: clamp(500px, 58vw, 620px) !important;
  background-color: #071b11;
}

.page-index .mi-slider-container .swiper-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(5, 19, 12, .82) 0%, rgba(5, 19, 12, .48) 48%, rgba(5, 19, 12, .74) 100%),
    linear-gradient(180deg, rgba(5, 19, 12, .12) 0%, rgba(5, 19, 12, .86) 100%);
  pointer-events: none;
}

.page-index .mi-slider-container .badge-pill {
  border-color: rgba(246, 240, 231, .32) !important;
  background: rgba(7, 51, 31, .42) !important;
  color: #f6f0e7 !important;
  font-weight: 600 !important;
  letter-spacing: .01em !important;
}

.page-index .mi-slider-container .amazonia-texto p,
.page-index .mi-slider-container .manos-descripcion {
  color: rgba(246, 240, 231, .9) !important;
  font-size: 1rem !important;
  line-height: 1.72 !important;
  font-weight: 500 !important;
  text-shadow: 0 2px 18px rgba(0,0,0,.32) !important;
}

.page-index .mi-slider-container .linea-punteada {
  border-top-color: rgba(246, 240, 231, .34) !important;
}

.page-index .mi-slider-container .btn-naranja {
  background: var(--s-terra) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: 0 12px 26px rgba(7, 25, 14, .22);
}

.page-index .mi-slider-container .btn-naranja:hover {
  background: var(--s-terra-dk) !important;
  transform: translateY(-2px) !important;
}

.page-index .mi-slider-container .mi-next,
.page-index .mi-slider-container .mi-prev {
  background: rgba(246, 240, 231, .16) !important;
  border-color: rgba(246, 240, 231, .34) !important;
}

.page-index .mi-slider-container .mi-next:hover,
.page-index .mi-slider-container .mi-prev:hover {
  background: rgba(246, 240, 231, .28) !important;
}

/* Trust strip: cleaner scan and less motion noise */
.fs-wrap {
  max-width: 1180px !important;
  margin: 2rem auto 3rem !important;
  padding: 0 1.25rem !important;
}

.fs-slider {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1rem !important;
}

.fs-slide {
  background: rgba(255,255,255,.78) !important;
  border: 1px solid rgba(7, 51, 31, .11) !important;
  border-radius: 14px !important;
  padding: 1.15rem 1.25rem !important;
  box-shadow: var(--s-shadow-xs) !important;
  min-height: 126px !important;
  transition: transform .22s var(--s-ease), box-shadow .22s var(--s-ease), border-color .22s var(--s-ease) !important;
}

.fs-slide:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(15, 107, 57, .24) !important;
  box-shadow: var(--s-shadow-sm) !important;
}

.fs-icon {
  background: var(--s-verde-cl) !important;
  border: 1px solid rgba(15, 107, 57, .12) !important;
}

.fs-title {
  color: var(--s-text) !important;
  font-weight: 800 !important;
}

.fs-desc {
  line-height: 1.55 !important;
}

.fs-dots {
  display: none !important;
}

/* Category carousel and repeated editorial sections */
.page-index .elementor-image-carousel .swiper-slide-inner {
  overflow: hidden;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(7, 51, 31, .1);
  box-shadow: var(--s-shadow-xs);
}

.page-index .elementor-image-carousel .swiper-slide-image {
  filter: saturate(.72) contrast(.96) sepia(.05);
  transition: transform .45s var(--s-ease), filter .3s var(--s-ease);
}

.page-index .elementor-image-carousel .swiper-slide-inner:hover .swiper-slide-image {
  transform: scale(1.035);
  filter: saturate(.86) contrast(1) sepia(.04);
}

.page-index .elementor-image-carousel-caption {
  color: var(--s-verde-osc) !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
}

/* Native product cards */
.product-miniature .card,
.product-miniature .card-product,
.product-miniature .thumbnail-container {
  border-radius: 16px !important;
}

.product-miniature .card,
.product-miniature .card-product {
  border-color: rgba(7, 51, 31, .1) !important;
  background: rgba(255,255,255,.9) !important;
}

.product-miniature .thumbnail-container {
  background: linear-gradient(145deg, #f8f2e8 0%, #ede4d6 100%) !important;
}

.product-miniature .card-img-top,
.product-miniature img.card-img-top,
.product-miniature .thumbnail-container img {
  filter: saturate(.78) contrast(.97) sepia(.04);
}

.product-miniature .price,
.product-price,
.product-prices .price,
span.price {
  color: var(--s-verde-osc) !important;
}

/* Buttons and conversion surfaces */
.btn-primary,
.add-to-cart,
button[data-button-action="add-to-cart"] {
  box-shadow: 0 10px 22px rgba(15, 107, 57, .18);
}

.btn-primary:hover,
.add-to-cart:hover,
button[data-button-action="add-to-cart"]:hover {
  box-shadow: 0 14px 30px rgba(7, 51, 31, .22);
}

#sanate-whatsapp .wa-btn {
  background: #128c4a !important;
  box-shadow: 0 12px 30px rgba(18, 140, 74, .28) !important;
}

#sanate-whatsapp .wa-btn:hover {
  background: #0b6f39 !important;
  box-shadow: 0 18px 40px rgba(18, 140, 74, .34) !important;
}

/* Popup: overlay nunca bloquea navegación en ningún tamaño */
html body .cp-popup-overlay {
  background: rgba(7, 25, 14, .34) !important;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  pointer-events: none !important;
}

html body .cp-popup-visible .cp-popup-inner .cp-container {
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 34px 90px rgba(7, 25, 14, .34) !important;
}

html body .cp-popup-visible form[id^="cp_"] {
  border-radius: 20px !important;
  overflow: hidden !important;
}

html body .cp-popup-visible input[type="submit"] {
  background: var(--s-verde) !important;
}

html body .cp-popup-visible input[type="submit"]:hover {
  background: var(--s-verde-osc) !important;
}

@media (min-width: 980px) {
  html body .cp-popup-visible {
    inset: auto 1.25rem 1.25rem auto !important;
    width: 430px !important;
    height: 266px !important;
  }

  html body .cp-popup-visible .cp-popup-inner {
    width: 430px !important;
    height: 266px !important;
  }

  html body .cp-popup-visible .cp-popup-inner .cp-container {
    left: auto !important;
    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    transform: scale(.61) !important;
    transform-origin: right bottom !important;
  }

  html body .cp-popup-overlay {
    background: transparent !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    pointer-events: none !important;
  }
}

@media (max-width: 900px) {
  .page-index .mi-slider-container {
    width: calc(100vw - 1.5rem) !important;
    min-height: 500px;
    margin-top: .9rem !important;
    border-radius: 14px !important;
  }

  .fs-slider {
    grid-template-columns: 1fr !important;
  }

  .fs-slide {
    min-height: auto !important;
  }
}

@media (max-width: 620px) {
  .page-index .mi-slider-container {
    min-height: 470px;
  }

  .page-index .mi-slider-container .swiper-slide {
    height: 470px !important;
  }

  .page-index .mi-slider-container .badge-pill {
    font-size: .78rem !important;
    padding: .42rem .9rem !important;
  }

  .page-index .mi-slider-container .amazonia-texto p,
  .page-index .mi-slider-container .manos-descripcion {
    font-size: .9rem !important;
    line-height: 1.6 !important;
  }

  html body .cp-popup-visible,
  html body .cp-popup-overlay {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}

/* ============================================================
   Capa final de armonia global
   Unifica escala tipografica, reduce botones flotantes y evita
   cortes de texto/imagenes en home y catalogos.
   ============================================================ */
body {
  font-family: 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: 15px;
}

.page-index .elementor-section,
.page-category .elementor-section,
.page-product .elementor-section {
  --section-space: clamp(3.5rem, 6vw, 6.5rem);
}

.page-index .elementor-section:not(.elementor-element-22b6ec5):not(.elementor-element-bcc62fb) {
  margin-block: 0 !important;
}

.page-index .elementor-widget-heading .elementor-heading-title {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 600 !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
}

.page-index .elementor-widget-text-editor,
.page-index .elementor-widget-text-editor p {
  font-size: clamp(.92rem, 1.1vw, 1rem) !important;
  line-height: 1.72 !important;
}

.page-index .elementor-button,
.page-category .elementor-button,
.page-product .elementor-button {
  border-radius: 999px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  min-height: 44px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  box-shadow: 0 12px 26px rgba(7, 51, 31, .13);
  transition: transform .22s var(--s-ease), box-shadow .22s var(--s-ease), background-color .22s var(--s-ease) !important;
}

.page-index .elementor-button:hover,
.page-category .elementor-button:hover,
.page-product .elementor-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(7, 51, 31, .18);
}

/* Promocion superior: mantiene mensaje, lo hace legible y sin corte */
.page-index .elementor-element-22b6ec5,
.page-index .elementor-element-22b6ec5 .elementor-column-wrap,
.page-index .elementor-element-22b6ec5 .elementor-widget-wrap,
.page-index .elementor-element-db23af8,
.page-index .elementor-element-db23af8 .elementor-widget-container,
.page-index .elementor-element-db23af8 .elementor-carousel-wrapper,
.page-index .elementor-element-db23af8 .swiper,
.page-index .elementor-element-db23af8 .swiper-wrapper,
.page-index .elementor-element-db23af8 .swiper-slide,
.page-index .elementor-element-db23af8 .elementor-testimonial-wrapper {
  min-height: 36px !important;
  height: auto !important;
}

.page-index .elementor-element-22b6ec5 {
  background: var(--s-verde) !important;
}

.page-index .elementor-element-db23af8 .elementor-testimonial-name {
  display: block !important;
  max-width: min(92vw, 760px);
  margin: 0 auto !important;
  padding: .58rem 1rem !important;
  color: #fff !important;
  font-size: .88rem !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-align: center !important;
}

/* Hero home: evita imagenes mal encajadas y textos cortados */
.page-index .mi-slider-container .swiper-slide[style*="banner1_1"] {
  background-image:
    linear-gradient(90deg, rgba(5, 19, 12, .16), rgba(5, 19, 12, .1)),
    url('/img/cms/Home/slider/banner1_1.webp') !important;
  background-position: center 48% !important;
}

.page-index .mi-slider-container .swiper-slide[style*="banner2_1"] {
  background-image:
    linear-gradient(90deg, rgba(5, 19, 12, .42), rgba(5, 19, 12, .2)),
    url('/img/cms/Home/slider/banner2_1.webp') !important;
  background-position: center !important;
}

.page-index .mi-slider-container .layout-amazonia {
  grid-template-columns: minmax(280px, 38%) minmax(80px, 22%) minmax(300px, 40%) !important;
  align-items: end !important;
}

.page-index .mi-slider-container .amazonia-texto,
.page-index .mi-slider-container .amazonia-boton-area {
  min-width: 0 !important;
}

.page-index .mi-slider-container .btn-naranja,
.page-index .mi-slider-container .elementor-button {
  background: #bdd63f !important;
  color: #102417 !important;
  border: 0 !important;
}

.page-index .mi-slider-container .btn-naranja:hover {
  background: #d4e86d !important;
  color: #102417 !important;
}

.hero-subcopy,
.page-index .hero-subcopy {
  max-width: min(92vw, 520px) !important;
  overflow-wrap: anywhere;
  text-wrap: balance;
  line-height: 1.38 !important;
}

/* Beneficios: una franja de confianza, no carrusel ruidoso */
.fs-wrap {
  position: relative;
  z-index: 2;
}

.fs-icon img {
  max-width: 20px !important;
  max-height: 20px !important;
  object-fit: contain !important;
}

/* Un solo WhatsApp: conservar el boton textual derecho, ocultar duplicados flotantes */
#sanate-whatsapp ~ #sanate-whatsapp {
  display: none !important;
}

a[href*="wa.me"]:not(#sanate-topbar a):not(.wa-btn):not(.kg-wa-btn):not(.caf-s3-btn):not(.caf-s6-btn):not(.sanate-order-btn) {
  transition: opacity .2s var(--s-ease), transform .2s var(--s-ease);
}

body > a[href*="wa.me"],
body > div:not(#sanate-whatsapp)[style*="fixed"] a[href*="wa.me"],
body > div:not(#sanate-whatsapp)[class*="whatsapp" i],
body > div:not(#sanate-whatsapp)[id*="whatsapp" i],
body > div:not(#sanate-whatsapp)[class*="wa-" i],
body > div:not(#sanate-whatsapp)[id*="wa-" i] {
  display: none !important;
}

#sanate-whatsapp {
  right: 1.35rem !important;
  bottom: 1.25rem !important;
  left: auto !important;
  z-index: 9998 !important;
}

#sanate-whatsapp .wa-btn {
  min-height: 46px !important;
  padding: .72rem 1.2rem !important;
  border-radius: 999px !important;
}

/* Catalogos inyectados: bajar saturacion y unificar tarjetas */
#san-catalog,
#ker-catalog,
#caf-page {
  background: #fbf8f1 !important;
}

.san-card,
.ker-card,
.product-miniature .thumbnail-container {
  border-radius: 16px !important;
}

.san-img-wrap img,
.ker-img-wrap img,
.kg-stage img#kg-main-img,
.caf-s1-img,
.caf-s3-img img {
  filter: saturate(.78) contrast(.98) sepia(.05);
}

.san-card::before {
  background: var(--s-verde) !important;
}

.san-tag {
  color: var(--s-verde-osc) !important;
  background: var(--s-verde-cl) !important;
}

.san-price,
.ker-price,
.kg-prod-price,
.caf-s3-price {
  color: var(--s-verde-osc) !important;
}

.caf-s3-btn,
.caf-s6-btn,
.kg-wa-btn {
  background: var(--s-verde) !important;
  box-shadow: 0 14px 30px rgba(7, 51, 31, .18) !important;
}

.caf-s3-btn:hover,
.caf-s6-btn:hover,
.kg-wa-btn:hover {
  background: var(--s-verde-osc) !important;
}

@media (max-width: 900px) {
  body {
    font-size: 14px;
  }

  #sanate-topbar {
    padding: .58rem .9rem !important;
    font-size: .78rem !important;
    line-height: 1.35 !important;
  }

  .page-index .mi-slider-container .layout-amazonia,
  .page-index .mi-slider-container .layout-manos {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 1rem !important;
    width: 100% !important;
    height: 100% !important;
    padding: 2rem 1.1rem 1.8rem !important;
    transform: none !important;
    text-align: center !important;
  }

  .page-index .mi-slider-container .amazonia-texto,
  .page-index .mi-slider-container .amazonia-boton-area,
  .page-index .mi-slider-container .manos-content {
    width: 100% !important;
    max-width: 340px !important;
    padding: 0 !important;
    text-align: center !important;
    align-items: center !important;
  }

  .page-index .mi-slider-container .linea-punteada {
    display: none !important;
  }

  .page-index .mi-slider-container .swiper-slide[style*="banner1_1"] {
    background-position: center top !important;
  }

  .page-index .mi-slider-container .swiper-slide[style*="banner2_1"] {
    background-position: center top !important;
  }

  .hero-subcopy,
  .page-index .hero-subcopy,
  .page-index .mi-slider-container .amazonia-texto p,
  .page-index .mi-slider-container .manos-descripcion {
    max-width: 330px !important;
    width: 100% !important;
    white-space: normal !important;
    overflow: visible !important;
  }

  #sanate-whatsapp {
    right: 1rem !important;
    bottom: 1rem !important;
  }
}

@media (max-width: 620px) {
  .page-index .elementor-element-db23af8 .elementor-testimonial-name {
    max-width: 340px;
    padding: .5rem 1rem !important;
    font-size: .82rem !important;
  }

  .page-index .mi-slider-container {
    width: calc(100vw - 2rem) !important;
    min-height: 498px !important;
    margin-top: 1.25rem !important;
  }

  .page-index .mi-slider-container .swiper-slide {
    height: 498px !important;
  }

  .page-index .mi-slider-container .badge-pill-container {
    top: 1.5rem !important;
  }

  .page-index .mi-slider-container .badge-pill {
    max-width: 300px;
    line-height: 1.3 !important;
    white-space: normal !important;
  }

  .page-index .mi-slider-container .amazonia-texto p,
  .page-index .mi-slider-container .manos-descripcion {
    font-size: .94rem !important;
  }

  .page-index .mi-slider-container .btn-naranja {
    min-height: 42px !important;
    padding: .72rem 1.35rem !important;
  }

  .fs-wrap {
    margin: 1.6rem auto 2.4rem !important;
  }

  .fs-slider {
    gap: .75rem !important;
  }

  .fs-slide {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    gap: .8rem !important;
    align-items: center !important;
    padding: .95rem !important;
  }

  .fs-icon {
    width: 48px !important;
    height: 48px !important;
  }

  .fs-title,
  .fs-desc {
    text-align: left !important;
  }

  #sanate-whatsapp .wa-label {
    display: inline !important;
  }

  #sanate-whatsapp .wa-btn {
    min-height: 44px !important;
    padding: .68rem .95rem !important;
    font-size: .82rem !important;
  }
}

/* BiBoske - capa final coherente */
:root {
  --s-verde: #0f6b39;
  --s-verde-osc: #07331f;
  --s-verde-cl: #edf5ea;
  --s-lima: #bacd42;
  --s-terra: #a65032;
  --s-terra-dk: #753520;
  --s-terra-cl: #f7ebe4;
  --s-arcilla: #b97852;
  --s-crema: #fbf8f1;
  --s-crema-dk: #eadfce;
  --s-text: #172018;
  --s-muted: #566053;
  --s-border: #ded6c9;
  --bb-paper: #fbf8f1;
  --bb-white: #fffdf8;
  --bb-radius: 32px;
}

html { scroll-behavior: smooth; }

body,
#san-catalog,
#ker-catalog,
#caf-page {
  background: var(--bb-paper) !important;
  color: var(--s-text) !important;
  font-family: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

#san-catalog p,
#ker-catalog p,
#caf-page p {
  font-size: .98rem;
  line-height: 1.68;
}

#caf-page,
#san-catalog,
#ker-catalog {
  overflow-x: hidden;
}

#caf-page .caf-s1 {
  height: clamp(500px, 64svh, 660px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  isolation: isolate;
  border-radius: 0 0 var(--bb-radius) var(--bb-radius) !important;
  background: var(--s-verde-osc) !important;
}

#caf-page .caf-s1-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 45% !important;
  filter: saturate(.72) contrast(.94) brightness(.72) !important;
  transform: scale(1.02);
}

#caf-page .caf-s1-ovl {
  background:
    linear-gradient(90deg, rgba(7, 31, 20, .9) 0%, rgba(7, 31, 20, .73) 43%, rgba(7, 31, 20, .36) 68%, rgba(7, 31, 20, .54) 100%),
    linear-gradient(180deg, rgba(7, 31, 20, .16) 0%, rgba(7, 31, 20, .78) 100%) !important;
}

#caf-page .caf-s1-brand {
  left: clamp(1.5rem, 5vw, 4.6rem) !important;
  bottom: clamp(2.5rem, 8vh, 5rem) !important;
  max-width: min(92vw, 650px);
  padding: 0 !important;
}

#caf-page .caf-s1-atasim {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(4rem, 9vw, 7.8rem) !important;
  font-weight: 300 !important;
  line-height: .82 !important;
  letter-spacing: .05em !important;
  text-shadow: 0 16px 42px rgba(0, 0, 0, .34);
}

#caf-page .caf-s1-coffee {
  color: var(--s-lima) !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(1.25rem, 2.3vw, 2rem) !important;
  line-height: 1.1 !important;
  margin: .15rem 0 1.15rem !important;
}

#caf-page .caf-s1-story {
  max-width: 560px;
  margin: 0 0 1rem !important;
  color: rgba(255, 253, 248, .92) !important;
  font-size: clamp(.95rem, 1.25vw, 1.08rem) !important;
  line-height: 1.62 !important;
}

#caf-page .caf-s1-points {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin: 0 0 1.25rem;
}

#caf-page .caf-s1-points span {
  border: 1px solid rgba(255, 253, 248, .28);
  border-radius: 999px;
  color: rgba(255, 253, 248, .86);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .06em;
  padding: .42rem .72rem;
  text-transform: uppercase;
}

#caf-page .caf-s1-cta,
#caf-page .caf-s6-btn {
  width: fit-content;
  background: var(--s-lima) !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: 0 14px 34px rgba(7, 51, 31, .22) !important;
  color: #102417 !important;
  font-weight: 800 !important;
  padding: .82rem 1.45rem !important;
}

#caf-page .caf-s1-cta:hover,
#caf-page .caf-s6-btn:hover {
  background: #d0df63 !important;
  color: #102417 !important;
}

#caf-page .caf-s1-footer {
  bottom: 2rem !important;
  right: clamp(1.25rem, 4vw, 3rem) !important;
  max-width: 390px;
}

#caf-page .caf-s1-loc,
#caf-page .caf-s1-badge {
  color: rgba(255, 253, 248, .72) !important;
}

#caf-page .caf-s2 {
  background: var(--bb-paper) !important;
  border-bottom: 1px solid var(--s-border) !important;
  gap: clamp(2rem, 5vw, 5rem) !important;
  padding: clamp(4rem, 7vw, 7rem) clamp(1.5rem, 5vw, 4rem) !important;
}

#caf-page .caf-s2-quote {
  border-left-color: var(--s-lima) !important;
  color: var(--s-verde-osc) !important;
}

#caf-page .caf-s2-right,
#caf-page .caf-s2-sub {
  border-color: var(--s-border) !important;
}

#caf-page .caf-s2-n,
#caf-page .caf-s3-h2,
#caf-page .caf-s6-h2 {
  color: var(--s-verde-osc) !important;
}

#caf-page .caf-s2-sub,
#caf-page .caf-s2-unit,
#caf-page .caf-s6-contact {
  color: var(--s-muted) !important;
}

#caf-page .caf-s3 {
  max-width: 1180px;
  margin: clamp(2rem, 4.5vw, 4rem) auto;
  overflow: hidden;
  background: var(--bb-white) !important;
  border: 1px solid var(--s-border) !important;
  border-radius: var(--bb-radius) !important;
  box-shadow: 0 24px 60px rgba(7, 51, 31, .08);
}

#caf-page .caf-s3-img,
#caf-page .caf-s3-body {
  background: var(--bb-white) !important;
}

#caf-page .caf-s3-img {
  background:
    radial-gradient(circle at 50% 38%, rgba(186, 205, 66, .18), transparent 38%),
    linear-gradient(145deg, #f7f1e8, #ede4d7) !important;
}

#caf-page .caf-s3-specs {
  border-color: var(--s-border) !important;
  border-radius: 16px !important;
}

#caf-page .caf-s3-specs > div {
  border-color: var(--s-border) !important;
}

#caf-page .caf-s3-price {
  color: var(--s-verde) !important;
}

#caf-page .caf-s3-btn {
  background: var(--s-verde) !important;
  border-radius: 999px !important;
  box-shadow: 0 16px 36px rgba(7, 51, 31, .18) !important;
}

#caf-page .caf-s3-btn:hover {
  background: var(--s-verde-osc) !important;
}

#caf-page .caf-s4 {
  margin-top: clamp(2rem, 4vw, 4rem);
  background:
    radial-gradient(circle at 88% 10%, rgba(186, 205, 66, .15), transparent 28%),
    var(--s-verde-osc) !important;
  border-radius: var(--bb-radius) var(--bb-radius) 0 0 !important;
}

#caf-page .caf-s4-h2 {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  color: #fffdf8 !important;
}

#caf-page .caf-s4-n {
  color: rgba(186, 205, 66, .24) !important;
}

#caf-page .caf-s5 {
  background: var(--s-verde) !important;
}

#caf-page .caf-s6 {
  background: var(--bb-paper) !important;
  padding: clamp(4.5rem, 7vw, 7rem) 1.5rem !important;
}

#san-catalog .san-hero {
  min-height: clamp(500px, 64svh, 680px) !important;
  border-radius: 0 0 var(--bb-radius) var(--bb-radius) !important;
  background:
    radial-gradient(circle at 82% 18%, rgba(186, 205, 66, .15), transparent 30%),
    linear-gradient(135deg, #062717 0%, var(--s-verde-osc) 58%, #0b4329 100%) !important;
}

#san-catalog .san-hero-main {
  font-size: clamp(4rem, 9vw, 8rem) !important;
  letter-spacing: .05em !important;
}

#san-catalog .san-hero-xtra,
#san-catalog .san-hero-badge,
#san-catalog .san-blog-title span {
  color: var(--s-lima) !important;
}

#san-catalog .san-hero-desc {
  color: rgba(255, 253, 248, .82) !important;
  font-size: 1rem !important;
  line-height: 1.7 !important;
}

#san-catalog .san-values,
#san-catalog .san-proceso,
#san-catalog .san-grid-wrap {
  background: var(--bb-paper) !important;
}

#san-catalog .san-card,
#san-catalog .san-bcard {
  border-color: var(--s-border) !important;
  box-shadow: 0 14px 34px rgba(7, 51, 31, .07) !important;
}

#san-catalog .san-bcard {
  --bcard-acc: var(--s-lima) !important;
}

#san-catalog .san-blog,
#san-catalog .san-cta-bar {
  background: var(--s-verde-osc) !important;
}

#san-catalog .san-cta-wa {
  background: var(--s-lima) !important;
  border-radius: 999px !important;
  color: #102417 !important;
}

#ker-catalog .ker-header-bar {
  padding: clamp(2.4rem, 5vw, 4rem) 1.5rem clamp(2.2rem, 4vw, 3rem) !important;
  background:
    radial-gradient(circle at 85% 15%, rgba(186, 205, 66, .14), transparent 26%),
    linear-gradient(135deg, #07331f 0%, #12482c 58%, #1d5b35 100%) !important;
  border-radius: 0 0 var(--bb-radius) var(--bb-radius) !important;
}

#ker-catalog .ker-header-bar h2 {
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: clamp(1.8rem, 3.4vw, 3rem) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
}

#ker-catalog .ker-header-bar p {
  color: rgba(255, 253, 248, .74) !important;
  font-size: .98rem !important;
}

#ker-catalog .ker-filter-bar {
  background: rgba(255, 253, 248, .96) !important;
  border-bottom-color: var(--s-border) !important;
  box-shadow: 0 12px 26px rgba(7, 51, 31, .06) !important;
}

#ker-catalog .ker-filter-btn {
  background: #fffdf8 !important;
  border-color: var(--s-border) !important;
  color: var(--s-muted) !important;
}

#ker-catalog .ker-filter-btn:hover,
#ker-catalog .ker-filter-btn.active {
  background: var(--s-terra) !important;
  border-color: var(--s-terra) !important;
  color: #fff !important;
}

#ker-catalog .ker-card {
  background: #fffdf8 !important;
  border-color: var(--s-border) !important;
  box-shadow: 0 14px 34px rgba(7, 51, 31, .07) !important;
}

#ker-catalog .ker-card:hover {
  border-color: rgba(166, 80, 50, .62) !important;
  box-shadow: 0 24px 54px rgba(7, 51, 31, .14) !important;
}

#ker-catalog .ker-img-wrap {
  background:
    radial-gradient(circle at 50% 28%, rgba(186, 205, 66, .1), transparent 32%),
    linear-gradient(145deg, #f4efe6, #e8dece) !important;
}

@media (max-width: 900px) {
  #caf-page .caf-s1 {
    height: 610px !important;
  }

  #caf-page .caf-s1-brand {
    left: 1.25rem !important;
    right: 1.25rem !important;
    bottom: 2rem !important;
    max-width: none;
  }

  #caf-page .caf-s1-footer {
    display: none !important;
  }

  #caf-page .caf-s1-atasim {
    font-size: clamp(3.4rem, 17vw, 5rem) !important;
  }

  #caf-page .caf-s1-story {
    font-size: .95rem !important;
  }

  #caf-page .caf-s2,
  #caf-page .caf-s3 {
    margin-left: 1rem;
    margin-right: 1rem;
  }

  #caf-page .caf-s3 {
    border-radius: 24px !important;
  }

  #san-catalog .san-hero-main {
    font-size: clamp(3.2rem, 15vw, 5rem) !important;
  }
}

@media (max-width: 620px) {
  #caf-page .caf-s1 {
    height: 640px !important;
    border-radius: 0 0 24px 24px !important;
  }

  #caf-page .caf-s1-img {
    object-position: 58% center !important;
  }

  #caf-page .caf-s1-points {
    gap: .45rem;
  }

  #caf-page .caf-s1-points span {
    font-size: .64rem;
    padding: .36rem .58rem;
  }

  #caf-page .caf-s3-img {
    min-height: 300px !important;
    padding: 2.3rem 1.75rem !important;
  }

  #caf-page .caf-s3-body {
    padding: 2.2rem 1.4rem !important;
  }

  #san-catalog .san-hero,
  #ker-catalog .ker-header-bar {
    border-radius: 0 0 24px 24px !important;
  }

  #san-catalog .san-hero {
    min-height: 520px !important;
  }
}

/* BioBoske - auditoria final: significado antes que ruido */
#sanate-topbar {
  background: var(--s-verde-osc) !important;
  color: rgba(255, 253, 248, .9) !important;
}

#sanate-topbar strong {
  color: #fffdf8 !important;
  letter-spacing: .02em;
}

#sanate-topbar a {
  color: #fff !important;
  text-underline-offset: 3px;
}

a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--s-lima) !important;
  outline-offset: 3px !important;
}

.page-index .elementor-element-db23af8 .elementor-testimonial-name {
  font-size: 0 !important;
  letter-spacing: 0 !important;
}

.page-index .elementor-element-db23af8 .elementor-testimonial-name::after {
  content: "BioBoske conecta Morona Santiago con compras directas y trazables.";
  display: inline-block;
  color: #fffdf8;
  font-size: .88rem !important;
  font-weight: 800;
  line-height: 1.35;
}

.elementor-element-db23af8 .elementor-testimonial-name {
  font-size: 0 !important;
  letter-spacing: 0 !important;
}

.elementor-element-db23af8 .elementor-testimonial-name::after {
  content: "BioBoske conecta Morona Santiago con compras directas y trazables.";
  display: inline-block;
  color: #fffdf8;
  font-size: .88rem !important;
  font-weight: 800;
  line-height: 1.35;
}

.page-index .mi-slider-container.bb-home-refined {
  background:
    linear-gradient(90deg, rgba(5, 19, 12, .9) 0%, rgba(5, 19, 12, .62) 46%, rgba(5, 19, 12, .42) 100%),
    url('/img/cms/Home/morona.webp') center / cover no-repeat !important;
  border-radius: 20px !important;
  isolation: isolate;
  overflow: hidden !important;
  position: relative !important;
  box-shadow: 0 24px 72px rgba(7, 25, 14, .16) !important;
}

html body.page-index .mi-slider-container.bb-home-refined > .swiper-wrapper {
  display: none !important;
}

.page-index .mi-slider-container.bb-home-refined .swiper-wrapper,
.page-index .mi-slider-container.bb-home-refined .swiper,
.page-index .mi-slider-container.bb-home-refined .mi-next,
.page-index .mi-slider-container.bb-home-refined .mi-prev,
.page-index .mi-slider-container.bb-home-refined .swiper-pagination {
  opacity: 0 !important;
  pointer-events: none !important;
}

.page-index .mi-slider-container.bb-home-refined .swiper-slide::before {
  background:
    linear-gradient(90deg, rgba(5, 19, 12, .86) 0%, rgba(5, 19, 12, .52) 46%, rgba(5, 19, 12, .72) 100%),
    linear-gradient(180deg, rgba(5, 19, 12, .08) 0%, rgba(5, 19, 12, .64) 100%) !important;
}

#bb-home-hero-copy,
.bb-home-hero-copy {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  justify-content: center;
  left: clamp(1.5rem, 6vw, 5rem);
  max-width: min(92vw, 720px);
  min-height: inherit;
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 100 !important;
}

.bb-home-kicker {
  color: var(--s-lima);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .13em;
  margin-bottom: .9rem;
  text-transform: uppercase;
}

#bb-home-hero-copy h1,
.bb-home-hero-copy h1 {
  color: #fffdf8;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(4.5rem, 11vw, 8.5rem);
  font-weight: 400;
  letter-spacing: 0;
  line-height: .86;
  margin: 0 0 1rem;
  text-shadow: 0 18px 44px rgba(0, 0, 0, .32);
}

#bb-home-hero-copy p,
.bb-home-hero-copy p {
  color: rgba(255, 253, 248, .9);
  font-size: clamp(1rem, 1.35vw, 1.18rem);
  font-weight: 600;
  line-height: 1.68;
  margin: 0 0 1.2rem;
  max-width: 620px;
}

.bb-home-pills {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-bottom: 1.25rem;
}

.bb-home-pills span {
  border: 1px solid rgba(255, 253, 248, .3);
  border-radius: 999px;
  color: rgba(255, 253, 248, .9);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  padding: .42rem .78rem;
  text-transform: uppercase;
}

.bb-home-cta {
  background: var(--s-lima);
  border-radius: 999px;
  color: #102417 !important;
  display: inline-flex;
  font-weight: 900;
  line-height: 1;
  padding: .9rem 1.45rem;
  text-decoration: none !important;
}

.bb-home-cta:hover {
  background: #d0df63;
  color: #102417 !important;
}

.page-index .mi-slider-container.bb-home-refined .badge-pill {
  background: rgba(7, 51, 31, .52) !important;
  border-color: rgba(255, 253, 248, .34) !important;
  color: #fffdf8 !important;
}

.page-index .elementor-element-54a20c0 .elementor-heading-title,
.page-index .elementor-element-eb685fd .elementor-heading-title,
.page-index .elementor-element-70725a9 .elementor-heading-title {
  font-size: 0 !important;
  letter-spacing: 0 !important;
}

.page-index .elementor-element-54a20c0 .elementor-heading-title::after {
  content: "Territorio";
  color: var(--s-lima);
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: clamp(1.3rem, 2.3vw, 2rem);
  font-weight: 800;
  line-height: 1.1;
}

.page-index .elementor-element-eb685fd .elementor-heading-title::after {
  content: "Origen";
  color: #fffdf8;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.1rem, 1.8vw, 1.7rem);
  font-weight: 500;
  line-height: 1;
}

.page-index .elementor-element-70725a9 .elementor-heading-title::after {
  content: "Morona Santiago";
  color: var(--s-lima);
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: clamp(1rem, 1.7vw, 1.45rem);
  font-weight: 900;
  letter-spacing: .04em;
  line-height: 1;
  text-transform: uppercase;
}

.page-index .mi-slider-container.bb-home-refined .btn-naranja,
.page-index .mi-slider-container.bb-home-refined .elementor-button {
  background: var(--s-lima) !important;
  color: #102417 !important;
  box-shadow: 0 14px 34px rgba(7, 25, 14, .24) !important;
}

.page-index .mi-slider-container.bb-home-refined .btn-naranja:hover,
.page-index .mi-slider-container.bb-home-refined .elementor-button:hover {
  background: #d0df63 !important;
  color: #102417 !important;
}

#bb-origin-path {
  background: var(--bb-paper);
  border-top: 1px solid var(--s-border);
  border-bottom: 1px solid var(--s-border);
  padding: clamp(3rem, 6vw, 5.5rem) 1.25rem;
}

.bb-origin-inner {
  max-width: 1180px;
  margin: 0 auto;
}

.bb-origin-head {
  display: grid;
  grid-template-columns: minmax(260px, .85fr) minmax(280px, 1fr);
  gap: clamp(1.4rem, 4vw, 4rem);
  align-items: end;
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
}

.bb-origin-kicker {
  color: var(--s-terra);
  display: block;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .12em;
  margin-bottom: .7rem;
  text-transform: uppercase;
}

.bb-origin-head h2 {
  color: var(--s-verde-osc);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2rem, 4vw, 4rem);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.02;
  margin: 0;
}

.bb-origin-head p {
  color: var(--s-muted);
  font-size: clamp(1rem, 1.4vw, 1.15rem);
  line-height: 1.7;
  margin: 0;
  max-width: 560px;
}

.bb-origin-steps {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  border-top: 1px solid var(--s-border);
  border-bottom: 1px solid var(--s-border);
}

.bb-origin-step {
  min-width: 0;
  padding: clamp(1.1rem, 2vw, 1.6rem);
}

.bb-origin-step + .bb-origin-step {
  border-left: 1px solid var(--s-border);
}

.bb-origin-step span {
  color: var(--s-terra);
  display: block;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  margin-bottom: .9rem;
}

.bb-origin-step b {
  color: var(--s-verde-osc);
  display: block;
  font-size: 1rem;
  font-weight: 900;
  margin-bottom: .42rem;
}

.bb-origin-step p {
  color: var(--s-muted);
  font-size: .84rem;
  line-height: 1.55;
  margin: 0;
}

#san-catalog .san-card {
  --acc: var(--s-verde) !important;
  --light: var(--s-verde-cl) !important;
}

#san-catalog .san-badge-pill,
#san-catalog .san-cta,
#san-catalog .san-card::before {
  background: var(--s-verde) !important;
}

#san-catalog .san-cta:hover,
#san-catalog .san-card:hover .san-cta {
  background: var(--s-verde-osc) !important;
}

#caf-page .caf-s1-cta {
  text-decoration: none !important;
}

#caf-page .caf-s3 {
  scroll-margin-top: 120px;
}

#caf-page .caf-s3-label {
  color: var(--s-terra) !important;
}

@media (max-width: 980px) {
  .bb-origin-head {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .bb-origin-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .bb-origin-step:nth-child(4) {
    border-left: 0;
  }

  .bb-origin-step:nth-child(n+4) {
    border-top: 1px solid var(--s-border);
  }
}

@media (max-width: 620px) {
  .page-index .elementor-element-db23af8 .elementor-testimonial-name::after {
    max-width: 320px;
    font-size: .8rem !important;
  }

  .page-index .mi-slider-container.bb-home-refined {
    min-height: 560px !important;
  }

  #bb-home-hero-copy,
  .bb-home-hero-copy {
    left: 1.4rem;
    right: 1.4rem;
    max-width: none;
  }

  #bb-home-hero-copy h1,
  .bb-home-hero-copy h1 {
    font-size: clamp(3.7rem, 18vw, 5rem);
  }

  #bb-origin-path {
    padding: 2.6rem 1rem;
  }

  .bb-origin-steps {
    grid-template-columns: 1fr;
  }

  .bb-origin-step,
  .bb-origin-step:nth-child(n) {
    border-left: 0;
    border-top: 1px solid var(--s-border);
  }

  .bb-origin-step:first-child {
    border-top: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }

  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
}

/* Home hero determinista: territorio antes que producto */
html body.page-index .mi-slider-container {
  background:
    linear-gradient(90deg, rgba(5, 19, 12, .9) 0%, rgba(5, 19, 12, .67) 48%, rgba(5, 19, 12, .5) 100%),
    url('/img/cms/Home/morona.webp') center / cover no-repeat !important;
  min-height: clamp(500px, 58vw, 620px) !important;
  overflow: hidden !important;
  position: relative !important;
}

html body.page-index .mi-slider-container > .swiper-wrapper,
html body.page-index .mi-slider-container .swiper-wrapper,
html body.page-index .mi-slider-container .swiper-pagination,
html body.page-index .mi-slider-container .mi-next,
html body.page-index .mi-slider-container .mi-prev,
html body.page-index .mi-slider-container .bb-home-hero-copy {
  display: none !important;
}

html body.page-index .mi-slider-container > * {
  display: none !important;
}

html body.page-index .mi-slider-container::before {
  color: var(--s-lima);
  content: "Morona Santiago · Alta Amazonía";
  font-size: .78rem;
  font-weight: 900;
  left: clamp(1.6rem, 6vw, 5rem);
  letter-spacing: .13em;
  position: absolute;
  text-transform: uppercase;
  top: clamp(4.8rem, 13vw, 7rem);
  z-index: 20;
}

html body.page-index .mi-slider-container::after {
  color: #fffdf8;
  content: "BioBoske\A Territorio, comunidad y procesos trazables antes de cada producto.";
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2.4rem, 6vw, 5.8rem);
  font-weight: 400;
  left: clamp(1.5rem, 6vw, 5rem);
  line-height: .98;
  max-width: min(86vw, 780px);
  position: absolute;
  text-shadow: 0 18px 44px rgba(0, 0, 0, .32);
  top: clamp(6.6rem, 16vw, 9rem);
  white-space: pre-line;
  z-index: 20;
}

@media (max-width: 620px) {
  html body.page-index .mi-slider-container {
    min-height: 560px !important;
  }

  html body.page-index .mi-slider-container::before {
    left: 1.35rem;
    top: 4.6rem;
  }

  html body.page-index .mi-slider-container::after {
    font-size: clamp(2.3rem, 14vw, 4.5rem);
    left: 1.3rem;
    max-width: calc(100vw - 3rem);
    top: 6.6rem;
  }
}

/* Home hero Elementor: origen antes que venta */
html body.page-index .elementor-element-5daabe5,
html body.page-index .elementor-element-5daabe5 > .elementor-column-wrap {
  background:
    linear-gradient(90deg, rgba(5, 19, 12, .9) 0%, rgba(5, 19, 12, .68) 48%, rgba(5, 19, 12, .42) 100%),
    url('/img/cms/Home/morona.webp') center / cover no-repeat !important;
}

html body.page-index .elementor-element-5daabe5 {
  position: relative !important;
}

html body.page-index .elementor-element-5daabe5::after {
  background: linear-gradient(180deg, rgba(5, 19, 12, 0) 0%, rgba(5, 19, 12, .24) 100%);
  bottom: 0;
  content: "";
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 0;
}

html body.page-index .elementor-element-5daabe5 > .elementor-column-wrap {
  position: relative !important;
  z-index: 1;
}

html body.page-index .elementor-element-54a20c0 .elementor-heading-title,
html body.page-index .elementor-element-dfd00ae .elementor-heading-title,
html body.page-index .elementor-element-eb685fd .elementor-heading-title,
html body.page-index .elementor-element-70725a9 .elementor-heading-title,
html body.page-index .elementor-element-faf4853 .hero-subcopy,
html body.page-index .elementor-element-509071f .hero-subcopy {
  color: transparent !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
}

html body.page-index .elementor-element-54a20c0 .elementor-heading-title::after,
html body.page-index .elementor-element-dfd00ae .elementor-heading-title::after,
html body.page-index .elementor-element-eb685fd .elementor-heading-title::after,
html body.page-index .elementor-element-70725a9 .elementor-heading-title::after,
html body.page-index .elementor-element-faf4853 .hero-subcopy::after,
html body.page-index .elementor-element-509071f .hero-subcopy::after {
  display: block;
  letter-spacing: 0;
  white-space: normal;
}

html body.page-index .elementor-element-54a20c0 .elementor-heading-title::after {
  color: #fffdf8;
  content: "BioBoske";
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(4rem, 7.6vw, 7.4rem);
  font-weight: 400;
  line-height: .86;
  text-shadow: 0 18px 44px rgba(0, 0, 0, .34);
}

html body.page-index .elementor-element-dfd00ae .elementor-heading-title::after {
  color: var(--s-lima);
  content: "Morona Santiago";
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: clamp(.86rem, 1.45vw, 1.18rem);
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}

html body.page-index .elementor-element-eb685fd .elementor-heading-title::after {
  color: #fffdf8;
  content: "Territorio";
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.7rem, 3vw, 2.7rem);
  font-weight: 500;
  line-height: 1;
}

html body.page-index .elementor-element-70725a9 .elementor-heading-title::after {
  color: var(--s-lima);
  content: "Antes del producto";
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: clamp(.9rem, 1.65vw, 1.22rem);
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

html body.page-index .elementor-element-faf4853 .hero-subcopy::after,
html body.page-index .elementor-element-509071f .hero-subcopy::after {
  color: #fffdf8;
  content: "Comunidad, tradicion y procesos trazables conducen cada compra.";
  font-size: clamp(1rem, 1.45vw, 1.18rem);
  font-weight: 700;
  line-height: 1.55;
  max-width: 34rem;
  text-shadow: 0 12px 30px rgba(0, 0, 0, .28);
}

html body.page-index .elementor-element-79ad39a .elementor-button,
html body.page-index .elementor-element-60ffed9 .elementor-button {
  background: var(--s-lima) !important;
  border-color: var(--s-lima) !important;
  color: #102417 !important;
  font-weight: 900 !important;
}

html body.page-index .elementor-element-79ad39a .elementor-button:hover,
html body.page-index .elementor-element-60ffed9 .elementor-button:hover {
  background: #d0df63 !important;
  color: #102417 !important;
}

@media (max-width: 620px) {
  html body.page-index .elementor-element-54a20c0 .elementor-heading-title::after {
    font-size: clamp(3.8rem, 17vw, 5.2rem);
  }

  html body.page-index .elementor-element-eb685fd .elementor-heading-title::after {
    font-size: clamp(1.45rem, 9vw, 2.25rem);
  }
}

/* Home hero activo: una sola narrativa de origen */
body.page-index.bb-home-origin-ready .elementor-element-a335053 {
  display: none !important;
}

body.page-index.bb-home-origin-ready .mi-slider-container {
  background:
    linear-gradient(90deg, rgba(5, 19, 12, .92) 0%, rgba(5, 19, 12, .72) 48%, rgba(5, 19, 12, .38) 100%),
    url('/img/cms/Home/morona.webp') center / cover no-repeat !important;
  border-radius: 16px !important;
  min-height: clamp(500px, 58vw, 620px) !important;
  overflow: hidden !important;
  position: relative !important;
}

body.page-index.bb-home-origin-ready .mi-slider-container::before,
body.page-index.bb-home-origin-ready .mi-slider-container::after {
  content: none !important;
}

body.page-index.bb-home-origin-ready .mi-slider-container > * {
  display: none !important;
}

body.page-index.bb-home-origin-ready .mi-slider-container > .bb-home-hero-copy {
  align-items: flex-start;
  display: flex !important;
  flex-direction: column;
  gap: clamp(.9rem, 1.8vw, 1.35rem);
  left: clamp(1.45rem, 6vw, 5rem);
  max-width: min(86vw, 720px);
  position: absolute;
  top: clamp(4.8rem, 11vw, 7.4rem);
  z-index: 20;
}

body.page-index.bb-home-origin-ready .mi-slider-container .bb-home-kicker {
  color: var(--s-lima);
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .12em;
  line-height: 1.2;
  text-transform: uppercase;
}

body.page-index.bb-home-origin-ready .mi-slider-container .bb-home-hero-copy h1 {
  color: #fffdf8;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(4.2rem, 8vw, 7.8rem);
  font-weight: 400;
  line-height: .86;
  margin: 0;
  text-shadow: 0 18px 44px rgba(0, 0, 0, .34);
}

body.page-index.bb-home-origin-ready .mi-slider-container .bb-home-hero-copy p {
  color: #fffdf8;
  font-size: clamp(1rem, 1.45vw, 1.2rem);
  font-weight: 700;
  line-height: 1.6;
  margin: 0;
  max-width: 34rem;
  text-shadow: 0 12px 30px rgba(0, 0, 0, .28);
}

body.page-index.bb-home-origin-ready .mi-slider-container .bb-home-pills {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}

body.page-index.bb-home-origin-ready .mi-slider-container .bb-home-pills span {
  background: rgba(255, 253, 248, .08);
  border: 1px solid rgba(255, 253, 248, .28);
  border-radius: 999px;
  color: #fffdf8;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  padding: .42rem .78rem;
  text-transform: uppercase;
}

body.page-index.bb-home-origin-ready .mi-slider-container .bb-home-cta {
  background: var(--s-lima);
  border-radius: 999px;
  color: #102417 !important;
  display: inline-flex;
  font-weight: 900;
  line-height: 1;
  padding: .9rem 1.45rem;
  text-decoration: none !important;
}

@media (max-width: 620px) {
  body.page-index.bb-home-origin-ready .mi-slider-container {
    border-radius: 0 !important;
    min-height: 560px !important;
  }

  body.page-index.bb-home-origin-ready .mi-slider-container > .bb-home-hero-copy {
    left: 1.3rem;
    max-width: calc(100vw - 2.6rem);
    right: 1.3rem;
    top: 4.7rem;
  }

  body.page-index.bb-home-origin-ready .mi-slider-container .bb-home-hero-copy h1 {
    font-size: clamp(3.7rem, 18vw, 5.2rem);
  }
}

/* BioBoske rescue layer v5: contrast, persistence and visual clarity */
:root {
  --bb-rescue-forest: #04331f;
  --bb-rescue-forest-2: #0b4f2e;
  --bb-rescue-ivory: #fffdf8;
  --bb-rescue-paper: #fbf8f1;
  --bb-rescue-gold: #e7d868;
  --bb-rescue-ink: #102417;
  --bb-rescue-muted: #344236;
  --bb-rescue-line: rgba(255, 253, 248, .18);
}

html body #caf-page .caf-s4 {
  background:
    radial-gradient(circle at 82% 8%, rgba(231, 216, 104, .13), transparent 30%),
    linear-gradient(180deg, #04331f 0%, #062b1b 100%) !important;
}

html body #caf-page .caf-s4-label {
  color: var(--bb-rescue-gold) !important;
  opacity: 1 !important;
}

html body #caf-page .caf-s4-h2,
html body #caf-page .caf-s4-body h3 {
  color: var(--bb-rescue-ivory) !important;
  text-shadow: 0 12px 30px rgba(0, 0, 0, .24) !important;
}

html body #caf-page .caf-s4-body h3 {
  font-size: clamp(1.05rem, 1.35vw, 1.28rem) !important;
  font-weight: 800 !important;
  line-height: 1.28 !important;
}

html body #caf-page .caf-s4-body p {
  color: rgba(255, 253, 248, .9) !important;
  font-size: clamp(.96rem, 1.05vw, 1.04rem) !important;
  line-height: 1.78 !important;
  max-width: 72rem !important;
}

html body #caf-page .caf-s4-n {
  color: var(--bb-rescue-gold) !important;
  opacity: .82 !important;
  text-shadow: 0 12px 34px rgba(0, 0, 0, .22) !important;
}

html body #caf-page .caf-s4-item,
html body #caf-page .caf-s4-item:last-child {
  border-color: var(--bb-rescue-line) !important;
}

html body #caf-commitments,
html body #san-story {
  scroll-margin-top: 138px !important;
}

html body #caf-page .caf-s3 {
  background: var(--bb-rescue-ivory) !important;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr) !important;
}

html body #caf-page .caf-s3-img {
  align-items: center !important;
  background:
    radial-gradient(circle at 48% 62%, rgba(7, 51, 31, .08), transparent 36%),
    linear-gradient(145deg, #f6efe5 0%, #ebe0d0 100%) !important;
  min-height: clamp(390px, 42vw, 540px) !important;
  overflow: hidden !important;
  padding: clamp(1.4rem, 3vw, 3rem) !important;
}

html body #caf-page .caf-s3-img img {
  background: #f9f3ec !important;
  border-radius: 22px !important;
  filter: saturate(.92) contrast(1.02) sepia(.02) drop-shadow(0 24px 48px rgba(7, 31, 20, .18)) !important;
  height: clamp(320px, 34vw, 430px) !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center 74% !important;
  width: min(100%, 430px) !important;
}

html body #san-catalog .san-blog {
  background:
    radial-gradient(circle at 80% 0%, rgba(231, 216, 104, .13), transparent 30%),
    linear-gradient(180deg, #04331f 0%, #062b1b 100%) !important;
}

html body #san-catalog .san-blog-ey,
html body #san-catalog .san-blog-title span {
  color: var(--bb-rescue-gold) !important;
  opacity: 1 !important;
}

html body #san-catalog .san-blog-title,
html body #san-catalog .san-blog-hd h2 {
  color: var(--bb-rescue-ivory) !important;
}

html body #san-catalog .san-blog-sub {
  color: rgba(255, 253, 248, .88) !important;
}

html body #san-catalog .san-bcard {
  background: var(--bb-rescue-ivory) !important;
  border: 1px solid rgba(231, 216, 104, .46) !important;
  color: var(--bb-rescue-ink) !important;
  opacity: 1 !important;
  transform: none !important;
}

html body #san-catalog .san-bcard * {
  text-shadow: none !important;
}

html body #san-catalog .san-bcard-cat,
html body #san-catalog .san-bcard-cta {
  color: var(--bb-rescue-forest-2) !important;
  opacity: 1 !important;
}

html body #san-catalog .san-bcard-time,
html body #san-catalog .san-bcard-date {
  color: #687365 !important;
  opacity: 1 !important;
}

html body #san-catalog .san-bcard-deco {
  color: rgba(15, 107, 57, .09) !important;
}

html body #san-catalog .san-bcard-body h3 {
  color: var(--bb-rescue-ink) !important;
  font-size: clamp(1.05rem, 1.2vw, 1.2rem) !important;
  line-height: 1.32 !important;
}

html body #san-catalog .san-bcard-body p {
  color: var(--bb-rescue-muted) !important;
  font-size: clamp(.94rem, 1vw, 1rem) !important;
  line-height: 1.72 !important;
}

html body #footer,
html body footer,
html body .footer-container {
  background: var(--bb-rescue-forest) !important;
  color: rgba(255, 253, 248, .9) !important;
}

html body #footer h1,
html body #footer h2,
html body #footer h3,
html body #footer h4,
html body #footer .h1,
html body #footer .h2,
html body #footer .h3,
html body #footer .h4,
html body footer h1,
html body footer h2,
html body footer h3,
html body footer h4 {
  color: var(--bb-rescue-ivory) !important;
}

html body #footer p,
html body #footer li,
html body #footer span,
html body #footer .cms-page-link,
html body #footer .contact-rich,
html body footer p,
html body footer li,
html body footer span {
  color: rgba(255, 253, 248, .86) !important;
}

html body #footer a,
html body footer a {
  color: var(--bb-rescue-ivory) !important;
  text-decoration-color: rgba(231, 216, 104, .55) !important;
}

html body #footer a:hover,
html body footer a:hover {
  color: var(--bb-rescue-gold) !important;
}

html body.page-index .elementor-widget-text-editor,
html body.page-index .elementor-widget-text-editor p,
html body.page-index .elementor-text-editor {
  color: var(--bb-rescue-muted) !important;
}

html body.page-index .elementor-section[style*="background"] .elementor-heading-title,
html body.page-index .elementor-section[style*="background"] .elementor-widget-text-editor,
html body.page-index .elementor-section[style*="background"] .elementor-widget-text-editor p,
html body.page-index .elementor-column[style*="background"] .elementor-heading-title,
html body.page-index .elementor-column[style*="background"] .elementor-widget-text-editor,
html body.page-index .elementor-column[style*="background"] .elementor-widget-text-editor p {
  color: var(--bb-rescue-ivory) !important;
}

html body.page-index .fs-slide .fs-title,
html body.page-index .fs-slide .fs-desc {
  color: var(--bb-rescue-ink) !important;
}

html body.page-index .card-efecto.bb-card-light .elementor-heading-title,
html body.page-index .card-efecto.bb-card-light .elementor-widget-text-editor,
html body.page-index .card-efecto.bb-card-light .elementor-widget-text-editor p,
html body.page-index .card-efecto.bb-card-light .elementor-widget-text-editor span,
html body.page-index .card-efecto.bb-card-light .elementor-widget-container,
html body.page-index .card-efecto.bb-card-light .elementor-widget-container p,
html body.page-index .card-efecto.bb-card-light .elementor-widget-container span {
  color: var(--bb-rescue-ink) !important;
}

html body.page-index .card-efecto.bb-card-media .elementor-heading-title,
html body.page-index .card-efecto.bb-card-media .elementor-widget-text-editor,
html body.page-index .card-efecto.bb-card-media .elementor-widget-text-editor p,
html body.page-index .card-efecto.bb-card-media .elementor-widget-text-editor span,
html body.page-index .card-efecto.bb-card-media .elementor-widget-container,
html body.page-index .card-efecto.bb-card-media .elementor-widget-container p,
html body.page-index .card-efecto.bb-card-media .elementor-widget-container span {
  color: var(--bb-rescue-ivory) !important;
  text-shadow: 0 12px 30px rgba(0, 0, 0, .28) !important;
}

@media (max-width: 760px) {
  html body #caf-page .caf-s3 {
    grid-template-columns: 1fr !important;
  }

  html body #caf-page .caf-s3-img {
    min-height: 340px !important;
  }

  html body #caf-page .caf-s3-img img {
    height: 310px !important;
    width: min(100%, 330px) !important;
  }

  html body #caf-page .caf-s4-item {
    gap: .9rem !important;
  }
}

/* Home contrast lock: light cards stay readable, dark media stays elegant */
html body.page-index #content .elementor-heading-title,
html body.page-index #content .elementor-widget-text-editor,
html body.page-index #content .elementor-widget-text-editor p,
html body.page-index #content .elementor-widget-text-editor span,
html body.page-index #content .elementor-text-editor,
html body.page-index #content .elementor-text-editor p,
html body.page-index #content .elementor-text-editor span,
html body.page-index #content .fs-title,
html body.page-index #content .fs-desc {
  color: var(--bb-rescue-ink) !important;
  text-shadow: none !important;
}

html body.page-index .mi-slider-container .bb-home-kicker,
html body.page-index .mi-slider-container .bb-home-hero-copy,
html body.page-index .mi-slider-container .bb-home-hero-copy h1,
html body.page-index .mi-slider-container .bb-home-hero-copy p,
html body.page-index .mi-slider-container .bb-home-pills span,
html body.page-index #content .bb-card-media .elementor-heading-title,
html body.page-index #content .bb-card-media .elementor-widget-text-editor,
html body.page-index #content .bb-card-media .elementor-widget-text-editor p,
html body.page-index #content .bb-card-media .elementor-widget-text-editor span,
html body.page-index #content .bb-card-media .elementor-text-editor,
html body.page-index #content .bb-card-media .elementor-text-editor p,
html body.page-index #content .bb-card-media .elementor-text-editor span {
  color: var(--bb-rescue-ivory) !important;
  text-shadow: 0 12px 30px rgba(0, 0, 0, .28) !important;
}

html body.page-index #content .bb-card-light .elementor-heading-title,
html body.page-index #content .bb-card-light .elementor-widget-text-editor,
html body.page-index #content .bb-card-light .elementor-widget-text-editor p,
html body.page-index #content .bb-card-light .elementor-widget-text-editor span,
html body.page-index #content .bb-card-light .elementor-text-editor,
html body.page-index #content .bb-card-light .elementor-text-editor p,
html body.page-index #content .bb-card-light .elementor-text-editor span {
  color: var(--bb-rescue-ink) !important;
  text-shadow: none !important;
}

/* Home global contrast lock for Elementor blocks rendered outside #content */
html body.page-index .elementor-heading-title,
html body.page-index .elementor-widget-text-editor,
html body.page-index .elementor-widget-text-editor p,
html body.page-index .elementor-widget-text-editor span,
html body.page-index .elementor-text-editor,
html body.page-index .elementor-text-editor p,
html body.page-index .elementor-text-editor span,
html body.page-index .fs-title,
html body.page-index .fs-desc {
  color: var(--bb-rescue-ink) !important;
  text-shadow: none !important;
}

html body.page-index .mi-slider-container .bb-home-kicker,
html body.page-index .mi-slider-container .bb-home-hero-copy,
html body.page-index .mi-slider-container .bb-home-hero-copy h1,
html body.page-index .mi-slider-container .bb-home-hero-copy p,
html body.page-index .mi-slider-container .bb-home-pills span,
html body.page-index .bb-card-media .elementor-heading-title,
html body.page-index .bb-card-media .elementor-widget-text-editor,
html body.page-index .bb-card-media .elementor-widget-text-editor p,
html body.page-index .bb-card-media .elementor-widget-text-editor span,
html body.page-index .bb-card-media .elementor-text-editor,
html body.page-index .bb-card-media .elementor-text-editor p,
html body.page-index .bb-card-media .elementor-text-editor span {
  color: var(--bb-rescue-ivory) !important;
  text-shadow: 0 12px 30px rgba(0, 0, 0, .28) !important;
}

html body.page-index .elementor-heading-title,
html body.page-index .elementor-widget-text-editor,
html body.page-index .elementor-widget-text-editor p,
html body.page-index .elementor-widget-text-editor span,
html body.page-index .elementor-text-editor,
html body.page-index .elementor-text-editor p,
html body.page-index .elementor-text-editor span,
html body.page-index .fs-title,
html body.page-index .fs-desc,
html body.page-index .elementor-icon-box-title,
html body.page-index .elementor-icon-box-title a,
html body.page-index .elementor-icon-box-description {
  color: var(--bb-rescue-ink) !important;
  text-shadow: none !important;
}

html body.page-index .mi-slider-container .bb-home-kicker,
html body.page-index .mi-slider-container .bb-home-hero-copy,
html body.page-index .mi-slider-container .bb-home-hero-copy h1,
html body.page-index .mi-slider-container .bb-home-hero-copy p,
html body.page-index .mi-slider-container .bb-home-pills span,
html body.page-index .bb-card-media .elementor-heading-title,
html body.page-index .bb-card-media .elementor-widget-text-editor,
html body.page-index .bb-card-media .elementor-widget-text-editor p,
html body.page-index .bb-card-media .elementor-widget-text-editor span,
html body.page-index .bb-card-media .elementor-text-editor,
html body.page-index .bb-card-media .elementor-text-editor p,
html body.page-index .bb-card-media .elementor-text-editor span {
  color: var(--bb-rescue-ivory) !important;
  text-shadow: 0 12px 30px rgba(0, 0, 0, .28) !important;
}

html body.page-index .elementor-element-c2fafd6 .elementor-heading-title,
html body.page-index .elementor-element-c2fafd6 .elementor-widget-text-editor,
html body.page-index .elementor-element-c2fafd6 .elementor-widget-text-editor p,
html body.page-index .elementor-element-c2fafd6 .elementor-widget-text-editor span,
html body.page-index .elementor-element-6e34da4 .elementor-heading-title,
html body.page-index .elementor-element-6e34da4 .elementor-widget-text-editor,
html body.page-index .elementor-element-6e34da4 .elementor-widget-text-editor p,
html body.page-index .elementor-element-6e34da4 .elementor-widget-text-editor span,
html body.page-index .elementor-element-07e2395 .elementor-heading-title,
html body.page-index .elementor-element-07e2395 .elementor-widget-text-editor,
html body.page-index .elementor-element-07e2395 .elementor-widget-text-editor p,
html body.page-index .elementor-element-07e2395 .elementor-widget-text-editor span {
  color: var(--bb-rescue-ink) !important;
  text-shadow: none !important;
}

html body.page-index .fs-wrap,
html body.page-index .fs-wrap *,
html body.page-index .fs-slide,
html body.page-index .fs-slide *,
html body.page-index .card-efecto,
html body.page-index .card-efecto *,
html body.page-index .fs-wrap,
html body.page-index .fs-wrap *,
html body.page-index .card-efecto,
html body.page-index .card-efecto * {
  opacity: 1 !important;
}

html body.page-index .card-efecto .elementor-widget-container,
html body.page-index .card-efecto .elementor-widget-wrap,
html body.page-index .card-efecto .elementor-widget-container,
html body.page-index .card-efecto .elementor-widget-wrap {
  filter: none !important;
}

html body #ker-catalog .bb-hero-title {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(4.3rem, 7.4vw, 6.8rem) !important;
  font-weight: 500 !important;
  line-height: .92 !important;
  letter-spacing: 0 !important;
  color: var(--bb-rescue-ivory) !important;
  text-shadow: 0 16px 42px rgba(0, 0, 0, .28) !important;
}

html body #ker-catalog .bb-hero-text {
  color: rgba(255, 253, 248, .9) !important;
  font-size: clamp(1rem, 1.2vw, 1.1rem) !important;
  line-height: 1.68 !important;
  max-width: 44rem !important;
}

html body #ker-catalog .bb-hero .bb-chip,
html body #ker-catalog .bb-hero .bb-pill {
  color: var(--bb-rescue-ivory) !important;
  border-color: rgba(255, 253, 248, .38) !important;
}

@media (max-width: 620px) {
  html,
  body {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  #sanate-topbar {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: .12rem .45rem !important;
    padding: .55rem .75rem !important;
    font-size: 0 !important;
    line-height: 1.35 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  #sanate-topbar strong,
  #sanate-topbar a {
    font-size: .72rem !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
  }

  #sanate-topbar strong::after {
    color: rgba(255, 253, 248, .86) !important;
    content: " · pedidos:";
    font-weight: 700 !important;
  }

  #sanate-topbar a[href^="mailto:"] {
    display: none !important;
  }

  html body.page-index .fs-wrap {
    margin: 1.15rem auto 2rem !important;
    padding: 0 1rem !important;
    overflow: visible !important;
  }

  html body.page-index .fs-slider {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: 1fr !important;
    gap: .8rem !important;
    height: auto !important;
    overflow: visible !important;
    transform: none !important;
  }

  html body.page-index .fs-slide {
    grid-template-columns: 46px minmax(0, 1fr) !important;
    left: auto !important;
    margin: 0 !important;
    min-height: auto !important;
    opacity: 1 !important;
    position: relative !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
    padding: .9rem !important;
  }

  html body.page-index .fs-slide * {
    opacity: 1 !important;
    transform: none !important;
  }

  html body.page-index .fs-title {
    font-size: 1rem !important;
    line-height: 1.25 !important;
  }

  html body.page-index .fs-desc {
    font-size: .88rem !important;
    line-height: 1.45 !important;
  }

  #sanate-whatsapp {
    bottom: .85rem !important;
    right: .85rem !important;
  }

  #sanate-whatsapp .wa-label {
    display: none !important;
  }

  #sanate-whatsapp .wa-btn {
    border-radius: 999px !important;
    min-height: 46px !important;
    min-width: 46px !important;
    padding: .75rem !important;
  }

  html body.page-index .elementor-element-db23af8 .elementor-testimonial-name,
  html body .elementor-element-db23af8 .elementor-testimonial-name {
    display: block !important;
    margin: 0 auto !important;
    max-width: calc(100vw - 2rem) !important;
    overflow: visible !important;
    text-align: center !important;
    white-space: normal !important;
    width: 100% !important;
  }

  html body.page-index .elementor-element-db23af8 .elementor-testimonial-name::after,
  html body .elementor-element-db23af8 .elementor-testimonial-name::after {
    content: "Compras directas y trazables." !important;
    display: block !important;
    font-size: .76rem !important;
    line-height: 1.32 !important;
    margin: 0 auto !important;
    max-width: 22rem !important;
    overflow-wrap: normal !important;
    white-space: normal !important;
  }
}

/* Product pages: canonical product experience */
html body#product #wrapper,
html body#product main {
  background: linear-gradient(180deg, #fbf8f1 0%, #f6f0e7 100%) !important;
}

html body#product #main {
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: clamp(2rem, 5vw, 4rem) 1.25rem 4rem !important;
}

html body#product .product-container {
  align-items: start !important;
  background: #fffdf8 !important;
  border: 1px solid rgba(7, 51, 31, .1) !important;
  border-radius: 24px !important;
  box-shadow: 0 24px 70px rgba(7, 51, 31, .08) !important;
  padding: clamp(1rem, 2.4vw, 1.8rem) !important;
}

html body#product .product-cover,
html body#product .images-container .js-qv-mask,
html body#product .thumb-container {
  border-color: rgba(7, 51, 31, .12) !important;
  border-radius: 16px !important;
}

html body#product .product-cover {
  background: #f8f3ec !important;
  overflow: hidden !important;
}

/* ============================================================
   BioBoske final system: server-rendered storefront
   ============================================================ */
body#index .page-home {
  background: #fbf8f1 !important;
}

html body #header {
  background: #fffdf8 !important;
  position: relative !important;
  z-index: 1050 !important;
}

html body #header,
html body #header .header-top,
html body #header .header-nav,
html body #header .header-banner,
html body #sanate-topbar {
  transition: background .22s ease, box-shadow .22s ease, opacity .18s ease, transform .18s ease;
}

html.bb-scrolled body #header {
  background: rgba(255, 253, 248, .88) !important;
  backdrop-filter: blur(16px) saturate(1.12);
  -webkit-backdrop-filter: blur(16px) saturate(1.12);
  box-shadow: 0 18px 42px rgba(7, 51, 31, .12) !important;
  left: 0 !important;
  position: fixed !important;
  right: 0 !important;
  top: 0 !important;
  width: 100% !important;
}

html.bb-scrolled body #header .header-top,
html.bb-scrolled body #header .elementor-location-header,
html.bb-scrolled body #header .elementor {
  background: rgba(255, 253, 248, .88) !important;
  backdrop-filter: blur(16px) saturate(1.12);
  -webkit-backdrop-filter: blur(16px) saturate(1.12);
}

html.bb-scrolled body #sanate-topbar,
html.bb-scrolled body #header .header-banner,
html.bb-scrolled body #header .header-nav {
  display: none !important;
}

html.bb-scrolled body #header .header-top {
  border-bottom: 1px solid rgba(18, 48, 31, .14) !important;
}

html.bb-scrolled body main {
  padding-top: 84px !important;
}

html.bb-scrolled body #header #_desktop_logo img,
html.bb-scrolled body #header .logo {
  max-height: 48px !important;
  width: auto !important;
}

.bb-global-menu {
  background: rgba(255, 253, 248, .86);
  backdrop-filter: blur(16px) saturate(1.12);
  -webkit-backdrop-filter: blur(16px) saturate(1.12);
  border-bottom: 1px solid rgba(18, 48, 31, .12);
  border-top: 1px solid rgba(18, 48, 31, .08);
  box-shadow: 0 14px 34px rgba(7, 51, 31, .06);
  font-family: "DM Sans", system-ui, sans-serif;
  position: sticky;
  top: 0;
  z-index: 1040;
}

.bb-global-menu-inner {
  align-items: center;
  display: flex;
  gap: .45rem;
  justify-content: center;
  margin: 0 auto;
  max-width: 1180px;
  overflow-x: auto;
  padding: .58rem clamp(1rem, 4vw, 2.5rem);
  scrollbar-width: none;
  white-space: nowrap;
}

.bb-global-menu-inner::-webkit-scrollbar {
  display: none;
}

.bb-global-menu-brand {
  align-items: center;
  display: none;
  flex: 0 0 auto;
  margin-right: clamp(.65rem, 2vw, 1.4rem);
  text-decoration: none !important;
}

body#index .bb-global-menu-brand {
  display: inline-flex;
}

.bb-global-menu-brand img {
  display: block;
  height: 36px;
  width: auto;
}

.bb-global-menu-link {
  border: 1px solid transparent;
  border-radius: 999px;
  color: #173322 !important;
  display: inline-flex;
  font-size: .88rem;
  font-weight: 900;
  line-height: 1;
  padding: .68rem 1rem;
  text-decoration: none !important;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.bb-global-menu-link:hover,
html.bb-route-home .bb-global-menu-home,
html.bb-route-cafe .bb-global-menu-cafe,
html.bb-route-infusiones .bb-global-menu-infusiones,
html.bb-route-ceramica .bb-global-menu-ceramica {
  background: #0b3b25;
  border-color: #0b3b25;
  color: #fffdf8 !important;
}

@media (max-width: 767px) {
  .bb-global-menu {
    box-shadow: 0 10px 26px rgba(7, 51, 31, .06);
  }

  .bb-global-menu-inner {
    justify-content: flex-start;
    padding: .55rem 1rem;
  }

  .bb-global-menu-brand {
    margin-right: .35rem;
  }

  .bb-global-menu-brand img {
    height: 30px;
  }

  .bb-global-menu-link {
    font-size: .82rem;
    padding: .66rem .9rem;
  }
}

#bb-home,
#bb-home *,
#caf-page,
#san-catalog,
#ker-catalog {
  box-sizing: border-box;
}

#bb-home {
  color: #173322;
  font-family: "DM Sans", system-ui, sans-serif;
  overflow: hidden;
}

#bb-home .bb-kicker {
  color: #b8cf42;
  display: inline-flex;
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.bbh-hero {
  min-height: clamp(560px, 66vw, 720px);
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.bbh-hero-bg,
.bbh-hero-shade {
  inset: 0;
  position: absolute;
}

.bbh-hero-bg {
  height: 100%;
  object-fit: cover;
  width: 100%;
  z-index: -2;
}

.bbh-hero-shade {
  background: linear-gradient(90deg, rgba(5, 26, 15, .94) 0%, rgba(5, 26, 15, .72) 48%, rgba(5, 26, 15, .24) 100%);
  z-index: -1;
}

.bbh-hero-copy {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 700px;
  padding: clamp(5rem, 9vw, 8rem) clamp(1.25rem, 7vw, 6rem);
}

.bbh-hero h1,
.bbh-section-head h2,
.bbh-loyalty h2 {
  font-family: "Cormorant Garamond", Georgia, serif;
  letter-spacing: 0;
}

.bbh-hero h1 {
  color: #fffdf8;
  font-size: clamp(3.6rem, 8vw, 7.4rem);
  font-weight: 400;
  line-height: .88;
  margin: 0;
  max-width: 12ch;
}

.bbh-hero p {
  color: rgba(255, 253, 248, .92);
  font-size: clamp(1rem, 1.25vw, 1.18rem);
  font-weight: 700;
  line-height: 1.65;
  margin: 0;
  max-width: 34rem;
}

.bbh-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: .5rem;
}

.bbh-actions a,
.bbh-loyalty-card a {
  align-items: center;
  background: #b8cf42;
  border-radius: 999px;
  color: #102417 !important;
  display: inline-flex;
  font-weight: 900;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  text-decoration: none !important;
}

.bbh-actions a + a {
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.34);
  color: #fffdf8 !important;
}

.bbh-origin,
.bbh-products {
  padding: clamp(4rem, 7vw, 7rem) clamp(1.25rem, 6vw, 5rem);
}

.bbh-section-head {
  max-width: 780px;
}

.bbh-section-head h2,
.bbh-loyalty h2 {
  color: #12301f;
  font-size: clamp(2.3rem, 5vw, 4.8rem);
  font-weight: 500;
  line-height: .98;
  margin: .55rem 0 1rem;
}

.bbh-section-head p,
.bbh-loyalty p {
  color: #4a5a4f;
  font-size: clamp(1rem, 1.2vw, 1.12rem);
  line-height: 1.75;
  margin: 0;
  max-width: 42rem;
}

.bbh-path {
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: clamp(2rem, 4vw, 3rem);
  overflow: hidden;
  border: 1px solid rgba(18, 48, 31, .12);
  border-radius: 18px;
}

.bbh-path article {
  background: #fffdf8;
  min-height: 220px;
  padding: clamp(1.25rem, 2vw, 1.8rem);
}

.bbh-path span {
  color: #8b6f28;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 3rem;
  line-height: 1;
}

.bbh-path h3,
.bbh-category h3,
.bbh-product-grid span {
  color: #173322;
}

.bbh-path h3 {
  font-size: 1.1rem;
  margin: 1.3rem 0 .55rem;
}

.bbh-path p,
.bbh-category p {
  color: #526258;
  line-height: 1.65;
  margin: 0;
}

.bbh-categories {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0 clamp(1.25rem, 6vw, 5rem) clamp(4rem, 7vw, 7rem);
}

.bbh-category {
  background: #fffdf8;
  border: 1px solid rgba(18,48,31,.12);
  border-radius: 18px;
  display: flex;
  flex-direction: column;
  min-height: 460px;
  overflow: hidden;
  padding: 1rem;
  text-decoration: none !important;
}

.bbh-category img {
  background: #f3ede3;
  border-radius: 14px;
  height: 260px;
  object-fit: contain;
  padding: 1rem;
  width: 100%;
}

.bbh-category span {
  color: #8b6f28;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .12em;
  margin-top: 1.1rem;
  text-transform: uppercase;
}

.bbh-category h3 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2rem, 3vw, 3rem);
  font-weight: 500;
  line-height: 1;
  margin: .35rem 0 .75rem;
}

.bbh-loyalty {
  align-items: center;
  background: #0b3b25;
  display: grid;
  gap: 2rem;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .6fr);
  padding: clamp(4rem, 7vw, 7rem) clamp(1.25rem, 6vw, 5rem);
}

.bbh-loyalty h2,
.bbh-loyalty p {
  color: #fffdf8;
}

.bbh-loyalty-card {
  background: #fffdf8;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 18px;
  padding: clamp(1.4rem, 3vw, 2rem);
}

.bbh-loyalty-card span {
  color: #8b6f28;
  display: block;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 3.4rem;
  line-height: .9;
}

.bbh-loyalty-card strong {
  color: #173322;
  display: block;
  font-size: 1.15rem;
  margin: .9rem 0 .6rem;
}

.bbh-loyalty-card p {
  color: #526258;
  margin-bottom: 1.25rem;
}

.bbh-product-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 2rem;
}

.bbh-product-grid a {
  background: #fffdf8;
  border: 1px solid rgba(18,48,31,.12);
  border-radius: 16px;
  display: block;
  overflow: hidden;
  padding: 1rem;
  text-decoration: none !important;
}

.bbh-product-grid img {
  aspect-ratio: 1 / 1;
  background: #f3ede3;
  border-radius: 12px;
  object-fit: contain;
  padding: 1rem;
  width: 100%;
}

.bbh-product-grid span {
  display: block;
  font-weight: 900;
  margin-top: 1rem;
}

/* Keep server-rendered category pages stable and remove old CE residue */
body#index:has(#bb-home) #content .elementor,
body#index:has(#caf-page) #content .elementor,
body#index:has(#san-catalog) #content .elementor,
body#index:has(#ker-catalog) #content .elementor,
body#index:has(#bb-home) #content .mi-slider-container,
body#index:has(#caf-page) #content .mi-slider-container,
body#index:has(#san-catalog) #content .mi-slider-container,
body#index:has(#ker-catalog) #content .mi-slider-container {
  display: none !important;
}

body#index:has(#bb-home) #wrapper,
body#index:has(#caf-page) #wrapper,
body#index:has(#san-catalog) #wrapper,
body#index:has(#ker-catalog) #wrapper {
  background: #fbf8f1 !important;
  padding-top: 0 !important;
}

body#index:has(#bb-home) #content,
body#index:has(#caf-page) #content,
body#index:has(#san-catalog) #content,
body#index:has(#ker-catalog) #content {
  background: transparent !important;
}

/* Product cleanup: no visual debt from rewards/reviews widgets */
body#product #loyalty,
body#product .reward_alert_message,
body#product #spr,
body#product .review_container,
body#product .product_reviews,
body#product .spr_product_reviews,
body#product .spr_reviews,
body#product .product_reviews_container {
  display: none !important;
}

html body#product h1.h1,
html body#product .product-container h1 {
  color: #12301f !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.35rem, 5.6vw, 4.8rem) !important;
  font-weight: 500 !important;
  line-height: .96 !important;
  margin-bottom: .6rem !important;
  max-width: 11ch !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

html body#product .product-prices .price,
html body#product span.price {
  color: #0f6f3c !important;
  font-size: clamp(1.55rem, 2.6vw, 2.05rem) !important;
  line-height: 1.1 !important;
}

html body#product .product-description,
html body#product #product-description-short,
html body#product .product-information p {
  color: #4b554f !important;
  font-size: 1rem !important;
  line-height: 1.75 !important;
}

@media (max-width: 900px) {
  .bbh-path,
  .bbh-categories,
  .bbh-product-grid,
  .bbh-loyalty {
    grid-template-columns: 1fr;
  }

  .bbh-category {
    min-height: 0;
  }
}

@media (max-width: 620px) {
  .bbh-hero {
    min-height: 620px;
  }

  .bbh-hero-copy {
    padding: 4.5rem 1.25rem;
  }

  .bbh-hero h1 {
    font-size: clamp(3.2rem, 17vw, 4.9rem);
  }

  .bbh-path article {
    min-height: 0;
  }
}

html body#product .product-cover img {
  object-fit: cover !important;
}

html body#product .breadcrumb,
html body#product .breadcrumb a {
  color: #0b6f3c !important;
  font-size: .84rem !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

html body#product h1.h1 {
  color: #102417 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.7rem, 5vw, 4.8rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: .98 !important;
  margin-bottom: 1.1rem !important;
}

html body#product .ce-product-name,
html body#product h1.ce-product-name,
html body#product .product-container .elementor-heading-title {
  color: #102417 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.7rem, 5vw, 4.8rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: .98 !important;
}

html body#product .product-price .current-price-value,
html body#product .product-price {
  color: #0b6f3c !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: clamp(1.6rem, 2.6vw, 2.1rem) !important;
  font-weight: 900 !important;
}

html body#product .product-description,
html body#product #product-description-short,
html body#product [id^="product-description-short"] {
  color: #344236 !important;
  font-size: 1.02rem !important;
  line-height: 1.72 !important;
}

html body#product .product-quantity .add,
html body#product .product-add-to-cart,
html body#product .product-actions {
  margin-top: 1.35rem !important;
}

html body#product .btn-primary,
html body#product .add-to-cart,
html body#product button[data-button-action="add-to-cart"] {
  background: #0b6f3c !important;
  border-color: #0b6f3c !important;
  border-radius: 999px !important;
  box-shadow: 0 16px 36px rgba(7, 51, 31, .16) !important;
  color: #fffdf8 !important;
  font-weight: 900 !important;
  padding-left: 1.45rem !important;
  padding-right: 1.45rem !important;
}

html body#product .tabs {
  background: #fffdf8 !important;
  border: 1px solid rgba(7, 51, 31, .1) !important;
  border-radius: 20px !important;
  box-shadow: 0 18px 52px rgba(7, 51, 31, .06) !important;
  margin-top: 2rem !important;
  padding: 1.2rem !important;
}

html body#product .tabs .nav-tabs {
  border-bottom-color: rgba(7, 51, 31, .14) !important;
}

html body#product .tabs .nav-link {
  color: #344236 !important;
  font-weight: 900 !important;
}

html body#product .tabs .nav-link.active {
  color: #0b6f3c !important;
  border-color: transparent transparent #0b6f3c transparent !important;
}

html body#product .product-features,
html body#product .data-sheet,
html body#product .product-description table {
  color: #102417 !important;
}

html body#product #sanate-whatsapp {
  z-index: 50 !important;
}

html body .caf-s3-buy {
  align-items: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .75rem !important;
}

html body .caf-s3-link {
  border: 1px solid rgba(7, 51, 31, .18) !important;
  border-radius: 999px !important;
  color: #102417 !important;
  display: inline-flex !important;
  font-weight: 900 !important;
  justify-content: center !important;
  line-height: 1 !important;
  padding: .82rem 1.25rem !important;
  text-decoration: none !important;
}

html body .caf-s3-link:hover {
  background: #102417 !important;
  color: #fffdf8 !important;
}

/* Product layout lock: prevent gallery, info and action blocks from crossing */
html body#product .product-container,
html body#product .product-information,
html body#product .product-actions,
html body#product .product-add-to-cart,
html body#product .product-quantity {
  clear: both !important;
  min-width: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

html body#product .product-container .row {
  align-items: flex-start !important;
}

html body#product .images-container,
html body#product .product-cover {
  max-width: 100% !important;
}

html body#product .product-cover {
  aspect-ratio: 1 / 1 !important;
}

html body#product .product-cover img,
html body#product .js-qv-product-cover {
  height: 100% !important;
  object-fit: contain !important;
  width: 100% !important;
}

html body#product .product-variants,
html body#product .product-discounts,
html body#product .product-additional-info,
html body#product .product-actions {
  margin-top: 1rem !important;
}

html body#product .product-quantity {
  align-items: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .75rem !important;
}

html body#product .product-quantity .qty,
html body#product .product-quantity .add {
  float: none !important;
  margin: 0 !important;
}

html body#product .product-quantity .add {
  flex: 1 1 180px !important;
}

html body#product .product-quantity .add .btn,
html body#product .product-quantity .add-to-cart {
  min-width: 180px !important;
  width: auto !important;
}

@media (min-width: 768px) {
  html body#product .product-container .col-md-6,
  html body#product .product-container .col-lg-6 {
    max-width: 50% !important;
  }
}

@media (max-width: 767px) {
  html body#product .product-cover {
    aspect-ratio: 1 / 1.05 !important;
  }

  html body#product .product-quantity {
    align-items: stretch !important;
  }

  html body#product .product-quantity .add,
  html body#product .product-quantity .add .btn,
  html body#product .product-quantity .add-to-cart {
    flex-basis: 100% !important;
    width: 100% !important;
  }

  html body#product .product-actions,
  html body#product .product-add-to-cart {
    overflow: visible !important;
  }
}

/* Home contrast lock: keep the premium hero readable on first paint */
html body#index #bb-home .bbh-hero {
  background: #052016 !important;
  border-radius: 0 0 28px 28px !important;
}

html body#index #bb-home .bbh-hero-bg {
  filter: saturate(.94) contrast(1.05) !important;
  object-position: center center !important;
}

html body#index #bb-home .bbh-hero-shade {
  background:
    radial-gradient(circle at 78% 42%, rgba(184, 207, 66, .16) 0%, rgba(184, 207, 66, 0) 34%),
    linear-gradient(90deg, rgba(2, 17, 10, .97) 0%, rgba(4, 31, 18, .9) 39%, rgba(4, 31, 18, .42) 72%, rgba(4, 31, 18, .24) 100%) !important;
}

html body#index #bb-home .bbh-hero-copy {
  position: relative !important;
  z-index: 2 !important;
}

html body#index #bb-home .bbh-hero .bb-kicker {
  color: #d7e65a !important;
  text-shadow: 0 10px 28px rgba(0, 0, 0, .36) !important;
}

html body#index #bb-home .bbh-hero h1 {
  color: #fffdf8 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: .9 !important;
  text-shadow: 0 18px 48px rgba(0, 0, 0, .44) !important;
}

html body#index #bb-home .bbh-hero p {
  color: #fff7e8 !important;
  text-shadow: 0 14px 34px rgba(0, 0, 0, .38) !important;
}

html body#index #bb-home .bbh-actions a {
  background: #c8df43 !important;
  border: 1px solid #c8df43 !important;
  box-shadow: 0 18px 42px rgba(3, 24, 14, .28) !important;
  color: #102417 !important;
}

html body#index #bb-home .bbh-actions a + a {
  background: rgba(255, 253, 248, .12) !important;
  border-color: rgba(255, 253, 248, .46) !important;
  color: #fffdf8 !important;
}

@media (max-width: 620px) {
  html body,
  html body#index #bb-home,
  html body#index #caf-page {
    overflow-x: hidden !important;
  }

  html body#index #bb-home .bbh-hero-copy {
    max-width: 100% !important;
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
    width: 100% !important;
  }

  html body#index #bb-home .bbh-hero h1,
  html body#index #bb-home .bbh-hero p,
  html body#index #bb-home .bbh-actions {
    max-width: calc(100vw - 2.5rem) !important;
  }

  html body#index #bb-home .bbh-hero h1 {
    font-size: clamp(3.05rem, 12.8vw, 3.9rem) !important;
    line-height: .94 !important;
    max-width: 9.4ch !important;
    overflow-wrap: normal !important;
    white-space: normal !important;
    width: auto !important;
  }

  html body#index #bb-home .bbh-hero p {
    font-size: .98rem !important;
    max-width: 21rem !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
    width: 100% !important;
  }

  html body#index #bb-home .bbh-actions a {
    min-width: 0 !important;
    padding-left: 1.05rem !important;
    padding-right: 1.05rem !important;
  }

  html body#index #bb-home .bbh-section-head h2,
  html body#index #bb-home .bbh-loyalty h2 {
    font-size: clamp(2rem, 9.8vw, 2.75rem) !important;
    line-height: 1.02 !important;
    max-width: 10ch !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
  }

  html body#index #bb-home .bbh-section-head {
    max-width: calc(100vw - 2.5rem) !important;
    width: 100% !important;
  }

  html body#index #caf-page .caf-s2 {
    overflow: hidden !important;
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
  }

  html body#index #caf-page .caf-s2-quote {
    display: block !important;
    font-size: clamp(1.2rem, 6.4vw, 1.75rem) !important;
    line-height: 1.48 !important;
    max-width: calc(100vw - 2.5rem) !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
    width: 100% !important;
  }
}

@media (max-width: 767px) {
  html body#product {
    overflow-x: hidden !important;
  }

  html body#product #main {
    padding: 1.25rem .9rem 3rem !important;
  }

  html body#product .elementor-section,
  html body#product .elementor-container,
  html body#product .elementor-row,
  html body#product .elementor-column,
  html body#product .elementor-column-wrap,
  html body#product .elementor-widget-wrap,
  html body#product .elementor-widget,
  html body#product .elementor-widget-container {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  html body#product .product-container {
    border-radius: 18px !important;
    padding: .9rem !important;
  }

  html body#product .images-container {
    display: flex !important;
    flex-direction: column !important;
    gap: .75rem !important;
    width: 100% !important;
  }

  html body#product .product-cover {
    order: 1 !important;
    width: 100% !important;
  }

  html body#product .product-cover img,
  html body#product .js-qv-product-cover {
    display: block !important;
    height: auto !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  html body#product .images-container .js-qv-mask,
  html body#product .images-container .mask {
    order: 2 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    width: 100% !important;
  }

  html body#product .product-images,
  html body#product .js-qv-product-images {
    display: flex !important;
    flex-direction: row !important;
    gap: .55rem !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    white-space: nowrap !important;
  }

  html body#product .thumb-container {
    flex: 0 0 72px !important;
    height: 72px !important;
    width: 72px !important;
  }

  html body#product .thumb-container img,
  html body#product .thumb {
    height: 100% !important;
    object-fit: cover !important;
    width: 100% !important;
  }

  html body#product .elementor-widget-product-images.elementor-position-left .elementor-widget-container {
    display: flex !important;
    flex-direction: column !important;
    gap: .75rem !important;
    min-height: 0 !important;
    overflow: hidden !important;
    width: 100% !important;
  }

  html body#product .elementor-widget-product-images,
  html body#product .elementor-widget-product-images .elementor-widget-container,
  html body#product .elementor-widget-product-images .elementor-swiper {
    margin-bottom: 0 !important;
    min-height: 0 !important;
  }

  html body#product .elementor-widget-product-images .elementor-widget-container > .elementor-swiper {
    width: 100% !important;
  }

  html body#product .elementor-widget-product-images .elementor-widget-container > .elementor-swiper:first-child {
    order: 1 !important;
  }

  html body#product .elementor-widget-product-images .elementor-widget-container > .elementor-swiper:nth-of-type(2) {
    order: 2 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  html body#product .elementor-widget-product-images .elementor-main-swiper,
  html body#product .elementor-widget-product-images .elementor-thumbnails-swiper {
    max-width: 100% !important;
    width: 100% !important;
  }

  html body#product .elementor-widget-product-images .elementor-main-swiper .swiper-wrapper,
  html body#product .elementor-widget-product-images .elementor-main-swiper .swiper-slide {
    max-width: 100% !important;
    width: 100% !important;
  }

  html body#product .elementor-widget-product-images .swiper-zoom-container,
  html body#product .elementor-widget-product-images .elementor-main-swiper img {
    display: block !important;
    max-height: 430px !important;
    max-width: 100% !important;
    object-fit: contain !important;
    width: 100% !important;
  }

  html body#product .elementor-widget-product-images .elementor-thumbnails-swiper .swiper-wrapper {
    display: flex !important;
    flex-direction: row !important;
    gap: .55rem !important;
    transform: none !important;
  }

  html body#product .elementor-widget-product-images .elementor-thumbnails-swiper .swiper-slide {
    flex: 0 0 72px !important;
    height: 72px !important;
    width: 72px !important;
  }

  html body#product .elementor-widget-product-images .elementor-thumbnails-swiper img {
    border-radius: 12px !important;
    height: 100% !important;
    object-fit: cover !important;
    width: 100% !important;
  }

  html body#product h1.h1 {
    font-size: clamp(2.35rem, 12vw, 3.8rem) !important;
  }

  html body#product .ce-product-name,
  html body#product h1.ce-product-name,
  html body#product .elementor-widget-product-name,
  html body#product .elementor-widget-product-name .elementor-heading-title,
  html body#product .product-container .elementor-heading-title {
    display: block !important;
    font-size: clamp(2rem, 8.8vw, 2.65rem) !important;
    line-height: 1.04 !important;
    max-width: 10.5ch !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
    width: auto !important;
    word-break: normal !important;
  }

  html body#product .ce-product-price,
  html body#product .ce-product-price span,
  html body#product .product-price,
  html body#product span.price {
    white-space: nowrap !important;
  }

  html body#product .elementor-widget-product-description-short,
  html body#product .ce-product-description-short,
  html body#product .ce-product-description-short p {
    display: block !important;
    max-width: calc(100vw - 2rem) !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
    width: 100% !important;
  }

  html body#product .tabs {
    border-radius: 16px !important;
    padding: .9rem !important;
  }
}

/* Coffee product: clear editorial lock */
html body#product.product-id-18 {
  background: #fbf8f1 !important;
  color: #102417 !important;
  overflow-x: hidden !important;
}

html body#product.product-id-18 #wrapper,
html body#product.product-id-18 #content-wrapper,
html body#product.product-id-18 #main,
html body#product.product-id-18 .elementor {
  background: #fbf8f1 !important;
}

html body#product.product-id-18 .elementor-element-54cc3e35 {
  background: #fbf8f1 !important;
  overflow: hidden !important;
  padding: clamp(1.4rem, 3vw, 2.8rem) clamp(1rem, 3vw, 2rem) clamp(2.4rem, 5vw, 4.8rem) !important;
}

html body#product.product-id-18 .elementor-element-54cc3e35 > .elementor-container {
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 1180px !important;
  width: 100% !important;
}

html body#product.product-id-18 .elementor-element-54cc3e35 .elementor-row {
  align-items: start !important;
  display: grid !important;
  gap: clamp(2rem, 5vw, 4.6rem) !important;
  grid-template-columns: minmax(0, .92fr) minmax(380px, 1fr) !important;
  width: 100% !important;
}

html body#product.product-id-18 .elementor-element-2c4a2d31,
html body#product.product-id-18 .elementor-element-179c67f2 {
  flex: initial !important;
  max-width: 100% !important;
  min-width: 0 !important;
  width: 100% !important;
}

html body#product.product-id-18 .elementor-element-179c67f2 > .elementor-column-wrap > .elementor-widget-wrap {
  align-content: flex-start !important;
  align-items: flex-start !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

html body#product.product-id-18 .elementor-widget-product-name,
html body#product.product-id-18 .elementor-widget-product-price,
html body#product.product-id-18 .elementor-widget-product-description-short,
html body#product.product-id-18 .elementor-widget-product-add-to-cart,
html body#product.product-id-18 .elementor-widget-product-meta,
html body#product.product-id-18 .elementor-widget-divider {
  clear: both !important;
  display: block !important;
  float: none !important;
  max-width: 100% !important;
  min-width: 0 !important;
  position: static !important;
  width: 100% !important;
}

html body#product.product-id-18 .elementor-widget-product-name,
html body#product.product-id-18 .elementor-widget-product-name .elementor-widget-container {
  margin: 0 !important;
  overflow: visible !important;
}

html body#product.product-id-18 .ce-product-name,
html body#product.product-id-18 h1.ce-product-name,
html body#product.product-id-18 .elementor-widget-product-name .elementor-heading-title {
  color: #102417 !important;
  display: block !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(3rem, 4.4vw, 4.7rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: .97 !important;
  margin: 0 0 1rem !important;
  max-width: 13.5ch !important;
  overflow: visible !important;
  overflow-wrap: normal !important;
  text-wrap: balance !important;
  white-space: normal !important;
  width: auto !important;
  word-break: normal !important;
}

html body#product.product-id-18 .elementor-widget-product-price,
html body#product.product-id-18 .elementor-widget-product-price .elementor-widget-container,
html body#product.product-id-18 .ce-product-prices {
  margin: 0 !important;
  overflow: visible !important;
  text-align: left !important;
  width: 100% !important;
}

html body#product.product-id-18 .ce-product-prices,
html body#product.product-id-18 .ce-product-price {
  display: block !important;
}

html body#product.product-id-18 .ce-product-price span,
html body#product.product-id-18 .product-price,
html body#product.product-id-18 span.price {
  color: #0b6f3c !important;
  display: inline-block !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: clamp(1.65rem, 2vw, 2.05rem) !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  margin: .1rem 0 .35rem !important;
  position: static !important;
  white-space: nowrap !important;
}

html body#product.product-id-18 .ce-tax-shipping-delivery-label {
  color: #667065 !important;
  display: block !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: .86rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  margin: 0 0 1.1rem !important;
}

html body#product.product-id-18 .elementor-widget-product-description-short {
  border-top: 1px solid rgba(18, 48, 31, .13) !important;
  margin-top: .9rem !important;
  padding-top: 1.15rem !important;
}

html body#product.product-id-18 .elementor-widget-product-add-to-wishlist {
  display: none !important;
}

html body#product.product-id-18 .elementor-widget-product-quantity,
html body#product.product-id-18 .elementor-widget-product-add-to-cart {
  clear: both !important;
  float: none !important;
  margin-top: 1.15rem !important;
  max-width: 100% !important;
  position: static !important;
  z-index: 1 !important;
}

html body#product.product-id-18 .elementor-widget-product-quantity {
  margin-right: .8rem !important;
  width: auto !important;
}

html body#product.product-id-18 .elementor-widget-product-add-to-cart {
  width: auto !important;
}

html body#product.product-id-18 .elementor-widget-product-add-to-cart .elementor-button,
html body#product.product-id-18 .elementor-widget-product-add-to-cart button,
html body#product.product-id-18 .elementor-widget-product-add-to-cart .ce-add-to-cart {
  align-items: center !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  justify-content: center !important;
  min-height: 52px !important;
  min-width: 180px !important;
  padding-left: 1.45rem !important;
  padding-right: 1.45rem !important;
  white-space: nowrap !important;
}

html body#product.product-id-18 .ce-product-description-short,
html body#product.product-id-18 .ce-product-description-short p,
html body#product.product-id-18 [id^="product-description-short"] {
  color: #3f4d43 !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: clamp(.98rem, 1.1vw, 1.08rem) !important;
  line-height: 1.72 !important;
  margin: 0 !important;
  max-width: 48rem !important;
  overflow-wrap: break-word !important;
  white-space: normal !important;
}

html body#product.product-id-18 .elementor-widget-product-images {
  background: #fff8f1 !important;
  border: 1px solid rgba(18, 48, 31, .1) !important;
  border-radius: 26px !important;
  box-shadow: 0 28px 70px rgba(18, 48, 31, .1) !important;
  overflow: hidden !important;
  padding: clamp(.75rem, 1.5vw, 1.2rem) !important;
  width: 100% !important;
}

html body#product.product-id-18 .elementor-widget-product-images .elementor-widget-container,
html body#product.product-id-18 .elementor-widget-product-images .elementor-swiper,
html body#product.product-id-18 .elementor-widget-product-images .elementor-main-swiper {
  background: #fff8f1 !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  width: 100% !important;
}

html body#product.product-id-18 .elementor-widget-product-images .elementor-main-swiper {
  aspect-ratio: 1 / 1.04 !important;
  border-radius: 22px !important;
}

html body#product.product-id-18 .elementor-widget-product-images .swiper-wrapper,
html body#product.product-id-18 .elementor-widget-product-images .swiper-slide,
html body#product.product-id-18 .elementor-widget-product-images .swiper-zoom-container {
  max-width: 100% !important;
  min-width: 0 !important;
}

html body#product.product-id-18 .elementor-widget-product-images .swiper-slide {
  align-items: center !important;
  background: #fff8f1 !important;
  justify-content: center !important;
  overflow: hidden !important;
}

html body#product.product-id-18 .elementor-widget-product-images .swiper-zoom-container {
  align-items: center !important;
  display: flex !important;
  height: 100% !important;
  justify-content: center !important;
  transform: none !important;
  width: 100% !important;
}

html body#product.product-id-18 .elementor-widget-product-images .elementor-main-swiper img {
  display: block !important;
  filter: none !important;
  height: 100% !important;
  image-rendering: auto !important;
  max-height: none !important;
  max-width: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: translateY(-6%) scale(1.16) !important;
  width: 100% !important;
}

html body#product.product-id-18 .elementor-widget-product-images .elementor-thumbnails-swiper {
  height: 82px !important;
  margin-top: .75rem !important;
  max-height: 82px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html body#product.product-id-18 .elementor-widget-product-images .elementor-thumbnails-swiper .swiper-wrapper,
html body#product.product-id-18 .elementor-widget-product-images .elementor-thumbnails-swiper .swiper-slide {
  height: 72px !important;
  max-height: 72px !important;
  min-height: 0 !important;
}

html body#product.product-id-18 .elementor-widget-product-images .elementor-thumbnails-swiper img {
  border: 1px solid rgba(18, 48, 31, .12) !important;
  border-radius: 12px !important;
  height: 72px !important;
  object-fit: cover !important;
  width: 72px !important;
}

@media (max-width: 900px) {
  html body#product.product-id-18 .elementor-element-54cc3e35 .elementor-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  html body#product.product-id-18 .ce-product-name,
  html body#product.product-id-18 h1.ce-product-name,
  html body#product.product-id-18 .elementor-widget-product-name .elementor-heading-title {
    font-size: clamp(2.45rem, 10.5vw, 3.55rem) !important;
    line-height: 1.02 !important;
    max-width: 11.8ch !important;
  }

  html body#product.product-id-18 .elementor-widget-product-images .elementor-main-swiper {
    aspect-ratio: 1 / 1.02 !important;
  }

  html body#product.product-id-18 .elementor-widget-product-images .elementor-main-swiper img {
    transform: translateY(-4%) scale(1.12) !important;
  }

  html body#product.product-id-18 .elementor-widget-product-quantity,
  html body#product.product-id-18 .elementor-widget-product-add-to-cart,
  html body#product.product-id-18 .elementor-widget-product-add-to-cart .elementor-button,
  html body#product.product-id-18 .elementor-widget-product-add-to-cart button,
  html body#product.product-id-18 .elementor-widget-product-add-to-cart .ce-add-to-cart {
    width: 100% !important;
  }
}

@media (max-width: 560px) {
  html body#product.product-id-18 .elementor-element-54cc3e35 {
    padding-left: .85rem !important;
    padding-right: .85rem !important;
  }

  html body#product.product-id-18 .elementor-widget-product-images {
    border-radius: 20px !important;
    padding: .55rem !important;
  }

  html body#product.product-id-18 .elementor-widget-product-images .elementor-main-swiper {
    border-radius: 16px !important;
  }

  html body#product.product-id-18 .ce-product-name,
  html body#product.product-id-18 h1.ce-product-name,
  html body#product.product-id-18 .elementor-widget-product-name .elementor-heading-title {
    font-size: clamp(2.1rem, 11.5vw, 2.95rem) !important;
    max-width: 11ch !important;
  }
}

/* Customer account forms: registration/login visual system */
html body#registration,
html body#authentication,
html body#password,
html body#identity {
  background: #fbf8f1 !important;
  color: #102417 !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  overflow-x: hidden !important;
}

html body#registration #wrapper,
html body#authentication #wrapper,
html body#password #wrapper,
html body#identity #wrapper {
  background:
    radial-gradient(circle at 12% 8%, rgba(200, 223, 67, .14), transparent 26rem),
    linear-gradient(180deg, #fbf8f1 0%, #f4eee4 100%) !important;
  padding: clamp(1.5rem, 4vw, 3rem) clamp(1rem, 4vw, 2.5rem) clamp(3rem, 6vw, 5rem) !important;
}

html body#registration #content-wrapper,
html body#authentication #content-wrapper,
html body#password #content-wrapper,
html body#identity #content-wrapper {
  float: none !important;
  margin: 0 auto !important;
  max-width: 1120px !important;
  padding: 0 !important;
  width: 100% !important;
}

html body#registration #main,
html body#authentication #main,
html body#password #main,
html body#identity #main {
  margin: 0 auto !important;
  max-width: 100% !important;
}

html body#registration #main .page-header,
html body#authentication #main .page-header,
html body#password #main .page-header,
html body#identity #main .page-header {
  margin: 0 auto clamp(1rem, 2.4vw, 1.6rem) !important;
  max-width: 860px !important;
  padding: 0 !important;
}

html body#registration #main .page-header h1,
html body#authentication #main .page-header h1,
html body#password #main .page-header h1,
html body#identity #main .page-header h1,
html body#registration #main .page-header .h1,
html body#authentication #main .page-header .h1,
html body#password #main .page-header .h1,
html body#identity #main .page-header .h1 {
  color: #102417 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.65rem, 6vw, 5.2rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: .95 !important;
  margin: 0 !important;
  max-width: 10.5ch !important;
  overflow-wrap: normal !important;
  text-wrap: balance !important;
  white-space: normal !important;
}

html body#registration #content.page-content,
html body#authentication #content.page-content,
html body#password #content.page-content,
html body#identity #content.page-content {
  background: #fffdf8 !important;
  border: 1px solid rgba(18, 48, 31, .11) !important;
  border-radius: 24px !important;
  box-sizing: border-box !important;
  box-shadow: 0 28px 76px rgba(18, 48, 31, .1) !important;
  color: #102417 !important;
  margin: 0 auto !important;
  max-width: 860px !important;
  overflow: hidden !important;
  padding: clamp(1.25rem, 3vw, 2.2rem) !important;
}

html body#registration .register-form,
html body#authentication .login-form,
html body#password .forgotten-password,
html body#identity #customer-form {
  color: #102417 !important;
  margin: 0 !important;
  max-width: 100% !important;
}

html body#registration .register-form > p,
html body#authentication .no-account,
html body#authentication .login-form-title,
html body#password #content p {
  color: #56645d !important;
  font-size: .98rem !important;
  line-height: 1.6 !important;
  margin: 0 0 1.25rem !important;
}

html body#registration .register-form > p a,
html body#authentication .no-account a,
html body#password #content a,
html body#identity #content a {
  color: #0b6f3c !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

html body#registration .register-form > p a:hover,
html body#authentication .no-account a:hover,
html body#password #content a:hover,
html body#identity #content a:hover {
  color: #87401f !important;
}

html body#registration #customer-form,
html body#authentication #login-form,
html body#password form,
html body#identity #customer-form {
  margin: 0 !important;
  width: 100% !important;
}

html body#registration #customer-form .form-group.row,
html body#authentication .login-form .form-group.row,
html body#password #content .form-group.row,
html body#identity #customer-form .form-group.row {
  align-items: start !important;
  background: transparent !important;
  border-bottom: 1px solid rgba(18, 48, 31, .09) !important;
  display: grid !important;
  float: none !important;
  gap: .45rem clamp(1rem, 3vw, 1.8rem) !important;
  grid-template-columns: minmax(180px, .46fr) minmax(0, .54fr) !important;
  margin: 0 !important;
  max-width: 100% !important;
  padding: 1rem 0 !important;
  width: 100% !important;
}

html body#registration #customer-form .form-group.row:last-of-type,
html body#authentication .login-form .form-group.row:last-of-type,
html body#password #content .form-group.row:last-of-type,
html body#identity #customer-form .form-group.row:last-of-type {
  border-bottom: 0 !important;
}

html body#registration #customer-form .form-group.row > .form-control-label,
html body#authentication .login-form .form-group.row > .form-control-label,
html body#password #content .form-group.row > .form-control-label,
html body#identity #customer-form .form-group.row > .form-control-label {
  align-self: start !important;
  color: #102417 !important;
  display: block !important;
  float: none !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: .88rem !important;
  font-weight: 900 !important;
  grid-column: 1 !important;
  letter-spacing: .01em !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  max-width: 100% !important;
  padding: .85rem 0 0 !important;
  text-align: left !important;
  width: 100% !important;
}

html body#registration #customer-form .form-control-label.required::after,
html body#authentication .login-form .form-control-label.required::after,
html body#password #content .form-control-label.required::after,
html body#identity #customer-form .form-control-label.required::after {
  color: #87401f !important;
  content: " *" !important;
  font-weight: 900 !important;
}

html body#registration #customer-form .js-input-column,
html body#authentication .login-form .js-input-column,
html body#password #content .js-input-column,
html body#identity #customer-form .js-input-column {
  box-sizing: border-box !important;
  display: block !important;
  float: none !important;
  grid-column: 2 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

html body#registration #customer-form .form-group.row > .form-control-comment:not(span),
html body#authentication .login-form .form-group.row > .form-control-comment:not(span),
html body#password #content .form-group.row > .form-control-comment:not(span),
html body#identity #customer-form .form-group.row > .form-control-comment:not(span) {
  color: #68776d !important;
  float: none !important;
  font-size: .82rem !important;
  font-weight: 700 !important;
  grid-column: 2 !important;
  line-height: 1.45 !important;
  margin: -.25rem 0 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  width: 100% !important;
}

html body#registration #customer-form .form-control,
html body#authentication .login-form .form-control,
html body#password #content .form-control,
html body#identity #customer-form .form-control {
  background: #fff !important;
  border: 1px solid rgba(18, 48, 31, .18) !important;
  border-radius: 13px !important;
  box-shadow: none !important;
  color: #102417 !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  height: 52px !important;
  line-height: 1.2 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: .85rem 1rem !important;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease !important;
  width: 100% !important;
}

html body#registration #customer-form .form-control:focus,
html body#authentication .login-form .form-control:focus,
html body#password #content .form-control:focus,
html body#identity #customer-form .form-control:focus {
  background: #fffdf8 !important;
  border-color: #0b6f3c !important;
  box-shadow: 0 0 0 4px rgba(11, 111, 60, .13) !important;
  color: #102417 !important;
  outline: 0 !important;
}

html body#registration #customer-form .form-control-comment,
html body#authentication .login-form .form-control-comment,
html body#password #content .form-control-comment,
html body#identity #customer-form .form-control-comment {
  color: #5f6e64 !important;
  overflow-wrap: break-word !important;
  white-space: normal !important;
  word-break: normal !important;
}

html body#registration #customer-form .js-input-column > .form-control-comment,
html body#authentication .login-form .js-input-column > .form-control-comment,
html body#password #content .js-input-column > .form-control-comment,
html body#identity #customer-form .js-input-column > .form-control-comment {
  display: block !important;
  font-size: .84rem !important;
  line-height: 1.45 !important;
  margin-top: .45rem !important;
}

html body#registration #customer-form .input-group,
html body#authentication .login-form .input-group,
html body#password #content .input-group,
html body#identity #customer-form .input-group {
  align-items: stretch !important;
  display: flex !important;
  width: 100% !important;
}

html body#registration #customer-form .input-group .form-control,
html body#authentication .login-form .input-group .form-control,
html body#password #content .input-group .form-control,
html body#identity #customer-form .input-group .form-control {
  border-radius: 13px 0 0 13px !important;
}

html body#registration #customer-form .input-group-btn,
html body#authentication .login-form .input-group-btn,
html body#password #content .input-group-btn,
html body#identity #customer-form .input-group-btn {
  display: flex !important;
}

html body#registration #customer-form .toggle-password,
html body#authentication .login-form .toggle-password,
html body#password #content .toggle-password,
html body#identity #customer-form .toggle-password {
  align-items: center !important;
  background: #f4eee4 !important;
  border: 1px solid rgba(18, 48, 31, .18) !important;
  border-left: 0 !important;
  border-radius: 0 13px 13px 0 !important;
  color: #102417 !important;
  display: inline-flex !important;
  height: 52px !important;
  justify-content: center !important;
  min-width: 52px !important;
  padding: 0 !important;
}

html body#registration #customer-form .custom-checkbox,
html body#identity #customer-form .custom-checkbox {
  display: block !important;
}

html body#registration #customer-form .form-group.row:has(.custom-checkbox),
html body#identity #customer-form .form-group.row:has(.custom-checkbox) {
  grid-template-columns: 1fr !important;
}

html body#registration #customer-form .form-group.row:has(.custom-checkbox) > .form-control-label,
html body#identity #customer-form .form-group.row:has(.custom-checkbox) > .form-control-label,
html body#registration #customer-form .form-group.row:has(.custom-checkbox) > .form-control-comment:not(span),
html body#identity #customer-form .form-group.row:has(.custom-checkbox) > .form-control-comment:not(span) {
  display: none !important;
}

html body#registration #customer-form .form-group.row:has(.custom-checkbox) .js-input-column,
html body#identity #customer-form .form-group.row:has(.custom-checkbox) .js-input-column {
  grid-column: 1 !important;
}

html body#registration #customer-form .custom-checkbox label,
html body#identity #customer-form .custom-checkbox label {
  box-sizing: border-box !important;
  color: #344236 !important;
  display: block !important;
  font-size: .93rem !important;
  font-weight: 700 !important;
  line-height: 1.55 !important;
  margin: 0 !important;
  max-width: 100% !important;
  overflow-wrap: break-word !important;
  padding-right: .45rem !important;
  white-space: normal !important;
  word-break: normal !important;
}

html body#registration #customer-form .custom-checkbox input,
html body#identity #customer-form .custom-checkbox input {
  appearance: auto !important;
  -webkit-appearance: checkbox !important;
  display: inline-block !important;
  height: 18px !important;
  margin: 0 .7rem 0 0 !important;
  opacity: 1 !important;
  position: static !important;
  vertical-align: -3px !important;
  width: 18px !important;
}

html body#registration #customer-form .custom-checkbox span,
html body#identity #customer-form .custom-checkbox span {
  display: none !important;
}

html body#registration #customer-form .custom-checkbox em,
html body#identity #customer-form .custom-checkbox em {
  color: #68776d !important;
  display: block !important;
  font-size: .84rem !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  margin: .25rem 0 0 1.8rem !important;
}

html body#registration #customer-form .form-footer,
html body#authentication .login-form .form-footer,
html body#password #content .form-footer,
html body#identity #customer-form .form-footer {
  background: transparent !important;
  border-top: 1px solid rgba(18, 48, 31, .12) !important;
  display: flex !important;
  justify-content: flex-end !important;
  margin-top: .8rem !important;
  padding-top: 1.35rem !important;
}

html body#registration #customer-form .form-control-submit,
html body#authentication .login-form .form-control-submit,
html body#password #content .form-control-submit,
html body#identity #customer-form .form-control-submit,
html body#registration #customer-form .btn-primary,
html body#authentication .login-form .btn-primary,
html body#password #content .btn-primary,
html body#identity #customer-form .btn-primary {
  background: #0b6f3c !important;
  border: 1px solid #0b6f3c !important;
  border-radius: 999px !important;
  box-shadow: 0 16px 36px rgba(7, 51, 31, .16) !important;
  color: #fffdf8 !important;
  float: none !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: .96rem !important;
  font-weight: 900 !important;
  min-height: 52px !important;
  min-width: 170px !important;
  padding: .85rem 1.6rem !important;
  text-transform: none !important;
}

html body#registration #customer-form .form-control-submit:hover,
html body#authentication .login-form .form-control-submit:hover,
html body#password #content .form-control-submit:hover,
html body#identity #customer-form .form-control-submit:hover {
  background: #87401f !important;
  border-color: #87401f !important;
}

@media (max-width: 767px) {
  html body#registration #wrapper,
  html body#authentication #wrapper,
  html body#password #wrapper,
  html body#identity #wrapper {
    padding: 1.1rem .85rem 3rem !important;
  }

  html body#registration #main .page-header h1,
  html body#authentication #main .page-header h1,
  html body#password #main .page-header h1,
  html body#identity #main .page-header h1,
  html body#registration #main .page-header .h1,
  html body#authentication #main .page-header .h1,
  html body#password #main .page-header .h1,
  html body#identity #main .page-header .h1 {
    font-size: clamp(2.35rem, 13vw, 3.25rem) !important;
    max-width: 8.8ch !important;
  }

  html body#registration #content.page-content,
  html body#authentication #content.page-content,
  html body#password #content.page-content,
  html body#identity #content.page-content {
    border-radius: 18px !important;
    max-width: calc(100vw - 1.7rem) !important;
    padding: 1rem !important;
    width: calc(100vw - 1.7rem) !important;
  }

  html body#registration #customer-form .form-group.row,
  html body#authentication .login-form .form-group.row,
  html body#password #content .form-group.row,
  html body#identity #customer-form .form-group.row {
    gap: .55rem !important;
    grid-template-columns: 1fr !important;
    padding: .95rem 0 !important;
  }

  html body#registration #customer-form .form-group.row > .form-control-label,
  html body#authentication .login-form .form-group.row > .form-control-label,
  html body#password #content .form-group.row > .form-control-label,
  html body#identity #customer-form .form-group.row > .form-control-label,
  html body#registration #customer-form .js-input-column,
  html body#authentication .login-form .js-input-column,
  html body#password #content .js-input-column,
  html body#identity #customer-form .js-input-column,
  html body#registration #customer-form .form-group.row > .form-control-comment:not(span),
  html body#authentication .login-form .form-group.row > .form-control-comment:not(span),
  html body#password #content .form-group.row > .form-control-comment:not(span),
  html body#identity #customer-form .form-group.row > .form-control-comment:not(span) {
    grid-column: 1 !important;
    padding-top: 0 !important;
  }

  html body#registration #customer-form .js-input-column,
  html body#authentication .login-form .js-input-column,
  html body#password #content .js-input-column,
  html body#identity #customer-form .js-input-column {
    padding-right: .45rem !important;
  }

  html body#registration #customer-form .js-input-column > .form-control-comment,
  html body#authentication .login-form .js-input-column > .form-control-comment,
  html body#password #content .js-input-column > .form-control-comment,
  html body#identity #customer-form .js-input-column > .form-control-comment {
    max-width: 31ch !important;
  }

  html body#registration #customer-form .custom-checkbox label,
  html body#identity #customer-form .custom-checkbox label {
    max-width: 30ch !important;
  }

  html body#registration #customer-form .custom-checkbox em,
  html body#identity #customer-form .custom-checkbox em {
    max-width: 28ch !important;
  }

  html body#registration #customer-form .form-control-submit,
  html body#authentication .login-form .form-control-submit,
  html body#password #content .form-control-submit,
  html body#identity #customer-form .form-control-submit,
  html body#registration #customer-form .btn-primary,
  html body#authentication .login-form .btn-primary,
  html body#password #content .btn-primary,
  html body#identity #customer-form .btn-primary {
    width: 100% !important;
  }
}

/* BioBoske refinements: login, search and richer editorial sections */
html body#authentication #content.page-content {
  max-width: 860px !important;
  padding: clamp(1.25rem, 3vw, 2.45rem) !important;
}

html body#authentication .login-form {
  float: none !important;
  margin: 0 auto !important;
  max-width: 680px !important;
  padding: 0 !important;
  width: 100% !important;
}

html body#authentication .login-form-title {
  color: #102417 !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: clamp(1.05rem, 1.7vw, 1.28rem) !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  line-height: 1.35 !important;
  margin: 0 auto 1.35rem !important;
  max-width: 34rem !important;
  text-align: center !important;
}

html body#authentication #login-form,
html body#authentication #login-form .custom_login_form_fields {
  float: none !important;
  margin: 0 auto !important;
  max-width: 620px !important;
  padding: 0 !important;
  width: 100% !important;
}

html body#authentication #login-form .form-group.row {
  grid-template-columns: minmax(180px, .42fr) minmax(0, .58fr) !important;
}

html body#authentication #login-form .form-group.row > .js-input-column,
html body#authentication #login-form .form-group.row > div:not(.form-control-comment):not(.form-control-label) {
  box-sizing: border-box !important;
  grid-column: 2 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

html body#authentication #login-form input.form-control,
html body#authentication #login-form .input-group,
html body#authentication #login-form .input-group .form-control {
  min-width: 0 !important;
  width: 100% !important;
}

html body#authentication #login-form .forgot-password {
  border-top: 1px solid rgba(18, 48, 31, .1) !important;
  margin-top: .95rem !important;
  padding-top: 1.25rem !important;
  text-align: center !important;
}

html body#authentication #login-form .forgot-password a {
  color: #0b6f3c !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

html body#authentication #login-form .form-footer {
  justify-content: center !important;
}

html body#authentication .no-account {
  margin: 1.1rem auto 0 !important;
  max-width: 620px !important;
  text-align: center !important;
}

html body#authentication .no-account a {
  border: 1px solid rgba(11, 111, 60, .2) !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  padding: .72rem 1rem !important;
}

html body #header .search-widget,
html body #header .elementor-widget-search,
html body #header .elementor-search-form {
  max-width: min(100%, 360px) !important;
}

html body #header input[type="search"],
html body #header input[name="s"],
html body #header input[name="search_query"],
html body #header .elementor-search__input {
  background: #fffdf8 !important;
  border: 1px solid rgba(18, 48, 31, .15) !important;
  border-radius: 999px !important;
  color: #102417 !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: .95rem !important;
  font-weight: 600 !important;
  min-height: 46px !important;
  padding-left: 1.15rem !important;
  padding-right: 1.15rem !important;
}

html body #header input[type="search"]::placeholder,
html body #header input[name="s"]::placeholder,
html body #header input[name="search_query"]::placeholder,
html body #header .elementor-search__input::placeholder {
  color: #79847e !important;
  opacity: 1 !important;
}

html body#search {
  background: #fbf8f1 !important;
  color: #102417 !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
}

html body#search #wrapper {
  background:
    radial-gradient(circle at 14% 10%, rgba(200, 223, 67, .12), transparent 25rem),
    linear-gradient(180deg, #fbf8f1 0%, #f4eee4 100%) !important;
  padding: clamp(1.25rem, 4vw, 3rem) clamp(1rem, 4vw, 2.5rem) 4rem !important;
}

html body#search #content-wrapper {
  float: none !important;
  margin: 0 auto !important;
  max-width: 1120px !important;
  padding: 0 !important;
  width: 100% !important;
}

html body#search #main .page-header,
html body#search #main .page-content,
html body#search #products {
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 980px !important;
}

html body#search #main .page-header h1,
html body#search #main .page-header .h1 {
  color: #102417 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.7rem, 5.2vw, 4.55rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  margin-bottom: clamp(1.2rem, 2.6vw, 2rem) !important;
  max-width: 20ch !important;
  text-transform: none !important;
}

html body#search #main h1 {
  color: #102417 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.7rem, 5.2vw, 4.55rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  margin-bottom: clamp(1.2rem, 2.6vw, 2rem) !important;
  max-width: 20ch !important;
  text-transform: none !important;
}

html body#search #content.page-content,
html body#search #js-product-list,
html body#search #products .page-not-found {
  background: #fffdf8 !important;
  border: 1px solid rgba(18, 48, 31, .1) !important;
  border-radius: 22px !important;
  box-shadow: 0 24px 70px rgba(18, 48, 31, .08) !important;
  color: #102417 !important;
  padding: clamp(1.3rem, 3vw, 2.2rem) !important;
}

html body#search #product-search-no-matches {
  color: #102417 !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: clamp(1.15rem, 2vw, 1.35rem) !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
  margin-bottom: .55rem !important;
}

html body#search #products p,
html body#search #content p {
  color: #56645d !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
}

html body#search .search-widget input,
html body#search #search_widget input,
html body#search input[type="search"] {
  background: #f8f3ec !important;
  border: 1px solid rgba(18, 48, 31, .12) !important;
  border-radius: 999px !important;
  color: #102417 !important;
  min-height: 52px !important;
}

html body#search .bb-search-suggestions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .7rem !important;
  margin-top: 1.25rem !important;
}

html body#search .bb-search-suggestions a {
  background: #0b6f3c !important;
  border: 1px solid #0b6f3c !important;
  border-radius: 999px !important;
  color: #fffdf8 !important;
  display: inline-flex !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  padding: .82rem 1.15rem !important;
  text-decoration: none !important;
}

html body#search .bb-search-suggestions a:hover {
  background: #87401f !important;
  border-color: #87401f !important;
}

.bbh-impact,
.bbh-assurance,
.san-ritual,
.ker-assurance {
  background: #fffdf8;
  border-top: 1px solid rgba(18, 48, 31, .08);
  padding: clamp(3.8rem, 7vw, 6.4rem) clamp(1.2rem, 5vw, 4rem);
}

.bbh-impact-inner,
.bbh-assurance-inner,
.san-ritual-inner,
.ker-assurance-inner {
  margin: 0 auto;
  max-width: 1180px;
}

.bbh-impact-grid,
.bbh-assurance-grid,
.san-ritual-grid,
.ker-assurance-grid {
  display: grid;
  gap: clamp(1rem, 2vw, 1.4rem);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: clamp(1.4rem, 3vw, 2.4rem);
}

.bbh-impact h2,
.bbh-assurance h2,
.san-ritual h2,
.ker-assurance h2 {
  color: #102417;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2.4rem, 5vw, 4.4rem);
  font-weight: 500;
  letter-spacing: 0;
  line-height: .96;
  margin: 0;
  max-width: 12ch;
}

.bbh-impact p,
.bbh-assurance p,
.san-ritual p,
.ker-assurance p {
  color: #4f5d54;
  font-size: 1rem;
  line-height: 1.7;
  margin: .9rem 0 0;
  max-width: 46rem;
}

.bbh-impact-card,
.bbh-assurance-card,
.san-ritual-card,
.ker-assurance-card {
  background: #fbf8f1;
  border: 1px solid rgba(18, 48, 31, .1);
  border-radius: 18px;
  color: #102417;
  min-height: 180px;
  padding: clamp(1.2rem, 2.4vw, 1.7rem);
}

.bbh-impact-card strong,
.bbh-assurance-card strong,
.san-ritual-card strong,
.ker-assurance-card strong {
  color: #102417;
  display: block;
  font-size: 1.05rem;
  font-weight: 900;
  line-height: 1.25;
}

.bbh-impact-card span,
.bbh-assurance-card span,
.san-ritual-card span,
.ker-assurance-card span {
  color: #0b6f3c;
  display: block;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .08em;
  margin-bottom: .8rem;
  text-transform: uppercase;
}

.bbh-impact-card p,
.bbh-assurance-card p,
.san-ritual-card p,
.ker-assurance-card p {
  color: #56645d;
  font-size: .95rem;
  line-height: 1.65;
  margin-top: .65rem;
}

html body#index #bb-home .bbh-section-head h2,
html body#index #bb-home .bbh-loyalty h2,
html body#index #bb-home .bbh-impact h2,
html body#index #bb-home .bbh-assurance h2 {
  color: #102417 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.8rem, 5.4vw, 4.9rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: .96 !important;
  max-width: 12ch !important;
}

html body#index #bb-home .bbh-assurance h2 {
  color: #fffdf8 !important;
}

html body#index #bb-home .bbh-section-head p,
html body#index #bb-home .bbh-loyalty p,
html body#index #bb-home .bbh-impact p,
html body#index #bb-home .bbh-assurance p {
  font-size: clamp(1rem, 1.25vw, 1.12rem) !important;
  line-height: 1.72 !important;
}

.bbh-assurance,
.ker-assurance {
  background: #07331f;
}

.bbh-assurance h2,
.bbh-assurance p,
.ker-assurance h2,
.ker-assurance p {
  color: #fffdf8;
}

.bbh-assurance-card,
.ker-assurance-card {
  background: rgba(255, 253, 248, .08);
  border-color: rgba(255, 253, 248, .18);
}

.bbh-assurance-card strong,
.ker-assurance-card strong {
  color: #fffdf8;
}

.bbh-assurance-card p,
.ker-assurance-card p {
  color: #dce8d8;
}

@media (max-width: 767px) {
  html body#authentication #login-form .form-group.row {
    grid-template-columns: 1fr !important;
  }

  html body#authentication .login-form-title {
    text-align: left !important;
  }

  html body#search #main .page-header h1,
  html body#search #main .page-header .h1 {
    font-size: clamp(2.55rem, 13vw, 3.45rem) !important;
    max-width: 8.5ch !important;
  }

  .bbh-impact-grid,
  .bbh-assurance-grid,
  .san-ritual-grid,
  .ker-assurance-grid {
    grid-template-columns: 1fr;
  }

  .bbh-impact,
  .bbh-assurance,
  .san-ritual,
  .ker-assurance {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

@media (max-width: 767px) {
  html,
  body {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  html body #header #_mobile_logo img,
  html body #header .top-logo img {
    content: url("/img/cms/Home/logo-bioboske.svg") !important;
    height: auto !important;
    max-height: 44px !important;
    object-fit: contain !important;
    width: 138px !important;
  }

  html body#authentication #main,
  html body#authentication #content.page-content,
  html body#authentication .login-form,
  html body#authentication #login-form,
  html body#authentication #login-form .custom_login_form_fields {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    width: 100% !important;
  }

  html body#authentication #login-form .form-group.row {
    display: grid !important;
    gap: .65rem !important;
    grid-template-columns: 1fr !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }

  html body#authentication #login-form .form-group.row > .form-control-label,
  html body#authentication #login-form .form-group.row > .js-input-column,
  html body#authentication #login-form .form-group.row > div:not(.form-control-comment):not(.form-control-label),
  html body#authentication #login-form .form-group.row > .form-control-comment:not(span) {
    box-sizing: border-box !important;
    grid-column: 1 !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
  }

  html body#authentication #login-form input.form-control,
  html body#authentication #login-form .input-group,
  html body#authentication #login-form .input-group .form-control {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  html body#authentication .login-form-title {
    font-size: clamp(1rem, 4.7vw, 1.18rem) !important;
    max-width: 100% !important;
    overflow-wrap: break-word !important;
  }

  html body#search #wrapper {
    overflow-x: hidden !important;
    padding-left: .85rem !important;
    padding-right: .85rem !important;
  }

  html body#search #main,
  html body#search #main .page-header,
  html body#search #main .page-content,
  html body#search #products {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  html body#search #main .page-header h1,
  html body#search #main .page-header .h1,
  html body#search #main h1 {
    font-size: clamp(2.25rem, 11.4vw, 3rem) !important;
    line-height: 1.04 !important;
    max-width: 100% !important;
    overflow-wrap: break-word !important;
    width: 100% !important;
  }

  html body#search #content.page-content,
  html body#search #js-product-list,
  html body#search #products .page-not-found {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    padding: 1rem !important;
    width: 100% !important;
  }

  html body#search .bb-search-suggestions {
    flex-wrap: wrap !important;
    gap: .5rem !important;
  }

  html body#search .search-widget,
  html body#search #search_widget,
  html body#search #content form,
  html body#search #products form {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  html body#search .search-widget input,
  html body#search #search_widget input,
  html body#search input[type="search"] {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
    width: 100% !important;
  }
}

@media (max-width: 767px) {
  html body #header #_mobile_logo,
  html body #header .top-logo {
    height: 52px !important;
    position: relative !important;
    width: 150px !important;
  }

  html body #header #_mobile_logo::before,
  html body #header .top-logo::before {
    background: url("/img/cms/Home/logo-bioboske.svg") center / contain no-repeat !important;
    content: "" !important;
    inset: 0 !important;
    pointer-events: none !important;
    position: absolute !important;
    z-index: 2 !important;
  }

  html body #header #_mobile_logo img,
  html body #header .top-logo img {
    opacity: 0 !important;
  }

  html body #header .elementor-element-104caa4 .elementor-image,
  html body #header .elementor-element-104caa4 .elementor-image a {
    display: block !important;
    height: 52px !important;
    position: relative !important;
    width: 150px !important;
  }

  html body #header .elementor-element-104caa4 .elementor-image a::before,
  html body #header .elementor-element-104caa4 .elementor-image::before {
    background: url("/img/cms/Home/logo-bioboske.svg") left center / contain no-repeat !important;
    content: "" !important;
    inset: 0 !important;
    pointer-events: none !important;
    position: absolute !important;
    z-index: 3 !important;
  }

  html body #header .elementor-element-104caa4 img {
    opacity: 0 !important;
  }

  html body#authentication #content.page-content,
  html body#search #content.page-content,
  html body#search #js-product-list,
  html body#search #products .page-not-found {
    max-width: calc(100vw - 1.7rem) !important;
    width: calc(100vw - 1.7rem) !important;
  }

  html body#authentication #content.page-content {
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 1.1rem !important;
  }

  html body#authentication #login-form .input-group-btn {
    flex: 0 0 48px !important;
    max-width: 48px !important;
  }

  html body#search #main .page-header h1,
  html body#search #main .page-header .h1,
  html body#search #main h1 {
    font-size: clamp(2.05rem, 10.7vw, 2.7rem) !important;
  }

  html body#search #content.page-content,
  html body#search #js-product-list,
  html body#search #products .page-not-found {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body #header .header-top .container {
    min-height: 72px !important;
    position: relative !important;
  }

  html body #header .header-top .container::before {
    background: url("/img/cms/Home/logo-bioboske.svg") left center / contain no-repeat !important;
    content: "" !important;
    height: 52px !important;
    left: 1rem !important;
    pointer-events: none !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 150px !important;
    z-index: 4 !important;
  }

  html body#search #content .search-widget,
  html body#search #products .search-widget {
    position: relative !important;
  }

  html body#search #content .search-widget input[type="search"],
  html body#search #products .search-widget input[type="search"] {
    padding-left: 3.1rem !important;
  }

  html body#search #content .search-widget button[type="submit"],
  html body#search #products .search-widget button[type="submit"] {
    align-items: center !important;
    background: transparent !important;
    border: 0 !important;
    color: transparent !important;
    display: flex !important;
    font-size: 0 !important;
    height: 44px !important;
    justify-content: center !important;
    left: .62rem !important;
    line-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 44px !important;
    z-index: 2 !important;
  }

  html body#search #content .search-widget button[type="submit"] i,
  html body#search #products .search-widget button[type="submit"] i {
    color: transparent !important;
    font-size: 0 !important;
  }

  html body#search #content .search-widget button[type="submit"]::before,
  html body#search #products .search-widget button[type="submit"]::before {
    border: 2px solid #102417 !important;
    border-radius: 50% !important;
    content: "" !important;
    height: 14px !important;
    width: 14px !important;
  }

  html body#search #content .search-widget button[type="submit"]::after,
  html body#search #products .search-widget button[type="submit"]::after {
    background: #102417 !important;
    content: "" !important;
    height: 8px !important;
    left: 27px !important;
    position: absolute !important;
    top: 27px !important;
    transform: rotate(45deg) !important;
    transform-origin: top center !important;
    width: 2px !important;
  }
}

/* BioBoske art direction v11: calmer titles, premium search and subtle motion */
html body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

html body#index #bb-home {
  --bb-ink: #102417;
  --bb-forest: #083b25;
  --bb-paper: #fffdf8;
  --bb-ivory: #fbf8f1;
  --bb-gold: #9f7a25;
  --bb-accent: #c8df43;
}

html body#index #bb-home h1,
html body#index #bb-home h2,
html body#index #bb-home h3,
html body#search #main h1,
html body#category #main h1,
html body#product #main h1 {
  letter-spacing: 0 !important;
  overflow-wrap: normal !important;
  text-wrap: balance;
  word-break: normal !important;
}

html body#index #bb-home .bbh-hero {
  min-height: clamp(520px, 58vw, 680px) !important;
}

html body#index #bb-home .bbh-hero-copy {
  gap: clamp(.78rem, 1.2vw, 1rem) !important;
  max-width: min(640px, 92vw) !important;
  padding-bottom: clamp(4.2rem, 8vw, 7rem) !important;
  padding-top: clamp(4.2rem, 8vw, 7rem) !important;
}

html body#index #bb-home .bbh-hero h1 {
  font-size: clamp(3.05rem, 6.2vw, 5.85rem) !important;
  font-weight: 500 !important;
  line-height: .98 !important;
  max-width: 13.5ch !important;
}

html body#index #bb-home .bbh-hero p {
  font-size: clamp(1rem, 1.12vw, 1.12rem) !important;
  line-height: 1.7 !important;
  max-width: 35rem !important;
}

html body#index #bb-home .bbh-origin,
html body#index #bb-home .bbh-products,
html body#index #bb-home .bbh-impact,
html body#index #bb-home .bbh-assurance {
  padding-bottom: clamp(4.5rem, 7vw, 7.25rem) !important;
  padding-top: clamp(4.5rem, 7vw, 7.25rem) !important;
}

html body#index #bb-home .bbh-section-head,
html body#index #bb-home .bbh-impact-inner,
html body#index #bb-home .bbh-assurance-inner {
  max-width: 1180px !important;
}

html body#index #bb-home .bbh-section-head h2,
html body#index #bb-home .bbh-loyalty h2,
html body#index #bb-home .bbh-impact h2,
html body#index #bb-home .bbh-assurance h2 {
  font-size: clamp(2.45rem, 4.2vw, 4.25rem) !important;
  font-weight: 500 !important;
  line-height: 1.04 !important;
  margin-bottom: clamp(1rem, 1.7vw, 1.35rem) !important;
  max-width: 16ch !important;
}

html body#index #bb-home .bbh-impact h2,
html body#index #bb-home .bbh-assurance h2 {
  max-width: 18ch !important;
}

html body#index #bb-home .bbh-section-head p,
html body#index #bb-home .bbh-loyalty p,
html body#index #bb-home .bbh-impact p,
html body#index #bb-home .bbh-assurance p {
  font-size: clamp(1rem, 1.08vw, 1.1rem) !important;
  line-height: 1.78 !important;
  max-width: 58rem !important;
}

html body#index #bb-home .bbh-loyalty {
  background:
    radial-gradient(circle at 84% 18%, rgba(200, 223, 67, .13), transparent 26rem),
    linear-gradient(135deg, #083b25 0%, #062a1b 100%) !important;
  gap: clamp(2rem, 5vw, 5rem) !important;
}

html body#index #bb-home .bbh-loyalty-card {
  border-radius: 16px !important;
  box-shadow: 0 28px 70px rgba(3, 21, 12, .22) !important;
  transform: translateZ(0);
}

html body#index #bb-home .bbh-path article,
html body#index #bb-home .bbh-category,
html body#index #bb-home .bbh-product-grid a,
html body#index #bb-home .bbh-impact-card,
html body#index #bb-home .bbh-assurance-card {
  transition: border-color .28s ease, box-shadow .28s ease, transform .28s ease, background-color .28s ease !important;
}

html body#index #bb-home .bbh-path article:hover,
html body#index #bb-home .bbh-category:hover,
html body#index #bb-home .bbh-product-grid a:hover,
html body#index #bb-home .bbh-impact-card:hover,
html body#index #bb-home .bbh-assurance-card:hover {
  border-color: rgba(159, 122, 37, .28) !important;
  box-shadow: 0 22px 58px rgba(18, 48, 31, .1) !important;
  transform: translateY(-3px);
}

html body#index #bb-home .bbh-actions a,
html body#index #bb-home .bbh-loyalty-card a {
  transition: box-shadow .25s ease, transform .25s ease, background-color .25s ease !important;
}

html body#index #bb-home .bbh-actions a:hover,
html body#index #bb-home .bbh-loyalty-card a:hover {
  box-shadow: 0 18px 42px rgba(6, 38, 22, .22) !important;
  transform: translateY(-2px);
}

html body #header .search-widget,
html body #header #search_widget,
html body #header .elementor-widget-search,
html body #header .elementor-search-form,
html body #header .elementor-search__container {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  display: block !important;
  height: auto !important;
  margin: 0 !important;
  max-width: min(360px, 28vw) !important;
  min-width: 240px !important;
  padding: 0 !important;
  position: relative !important;
  width: 100% !important;
}

html body #header .search-widget form,
html body #header #search_widget form,
html body #header .elementor-search-form {
  box-sizing: border-box !important;
  display: block !important;
  margin: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  position: relative !important;
  width: 100% !important;
}

html body #header input[type="search"],
html body #header input[name="s"],
html body #header input[name="search_query"],
html body #header .elementor-search__input {
  background: #fffdf8 !important;
  border: 1px solid rgba(16, 36, 23, .14) !important;
  border-radius: 999px !important;
  box-shadow: 0 12px 30px rgba(16, 36, 23, .06) !important;
  box-sizing: border-box !important;
  color: #102417 !important;
  display: block !important;
  font-size: .95rem !important;
  font-weight: 700 !important;
  height: 48px !important;
  line-height: 48px !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-height: 48px !important;
  min-width: 0 !important;
  padding: 0 1.15rem 0 3rem !important;
  width: 100% !important;
}

html body #header .search-widget button[type="submit"],
html body #header #search_widget button[type="submit"],
html body #header .elementor-search-form button,
html body #header .elementor-search__submit {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: transparent !important;
  display: flex !important;
  font-size: 0 !important;
  height: 38px !important;
  justify-content: center !important;
  left: .55rem !important;
  line-height: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 38px !important;
  z-index: 2 !important;
}

html body #header .search-widget button[type="submit"] i,
html body #header #search_widget button[type="submit"] i,
html body #header .elementor-search__submit i {
  color: transparent !important;
  font-size: 0 !important;
}

html body #header .search-widget button[type="submit"]::before,
html body #header #search_widget button[type="submit"]::before,
html body #header .elementor-search-form button::before,
html body #header .elementor-search__submit::before {
  border: 2px solid #102417 !important;
  border-radius: 50% !important;
  content: "" !important;
  height: 13px !important;
  width: 13px !important;
}

html body #header .search-widget button[type="submit"]::after,
html body #header #search_widget button[type="submit"]::after,
html body #header .elementor-search-form button::after,
html body #header .elementor-search__submit::after {
  background: #102417 !important;
  content: "" !important;
  height: 8px !important;
  left: 24px !important;
  position: absolute !important;
  top: 24px !important;
  transform: rotate(45deg) !important;
  width: 2px !important;
}

@media (max-width: 1024px) {
  html body #header .search-widget,
  html body #header #search_widget,
  html body #header .elementor-widget-search,
  html body #header .elementor-search-form,
  html body #header .elementor-search__container {
    max-width: 300px !important;
    min-width: 220px !important;
  }
}

@media (max-width: 767px) {
  html body#index #bb-home .bbh-hero {
    min-height: 560px !important;
  }

  html body#index #bb-home .bbh-hero-copy {
    gap: .75rem !important;
    padding: 3.4rem 1.15rem 3.9rem !important;
  }

  html body#index #bb-home .bbh-hero h1 {
    font-size: clamp(2.7rem, 11vw, 3.45rem) !important;
    line-height: 1.02 !important;
    max-width: 12.5ch !important;
  }

  html body#index #bb-home .bbh-hero p {
    font-size: .98rem !important;
    line-height: 1.62 !important;
    max-width: 22rem !important;
  }

  html body#index #bb-home .bbh-origin,
  html body#index #bb-home .bbh-products,
  html body#index #bb-home .bbh-impact,
  html body#index #bb-home .bbh-assurance,
  html body#index #bb-home .bbh-loyalty {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  html body#index #bb-home .bbh-section-head h2,
  html body#index #bb-home .bbh-loyalty h2,
  html body#index #bb-home .bbh-impact h2,
  html body#index #bb-home .bbh-assurance h2 {
    font-size: clamp(2.05rem, 9vw, 2.75rem) !important;
    line-height: 1.08 !important;
    max-width: 100% !important;
  }

  html body#index #bb-home .bbh-section-head p,
  html body#index #bb-home .bbh-loyalty p,
  html body#index #bb-home .bbh-impact p,
  html body#index #bb-home .bbh-assurance p {
    font-size: .98rem !important;
    line-height: 1.7 !important;
    max-width: 100% !important;
  }

  html body#index #bb-home .bbh-loyalty {
    gap: 1.35rem !important;
  }

  html body #header .search-widget,
  html body #header #search_widget,
  html body #header .elementor-widget-search,
  html body #header .elementor-search-form,
  html body #header .elementor-search__container {
    min-width: 0 !important;
    width: min(100%, 320px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body#index #bb-home .bbh-path article,
  html body#index #bb-home .bbh-category,
  html body#index #bb-home .bbh-product-grid a,
  html body#index #bb-home .bbh-impact-card,
  html body#index #bb-home .bbh-assurance-card,
  html body#index #bb-home .bbh-actions a,
  html body#index #bb-home .bbh-loyalty-card a {
    transition: none !important;
    transform: none !important;
  }
}

/* BioBoske v11.1: final header search and hero rhythm */
html body#index #bb-home .bbh-hero h1 {
  font-size: clamp(2.95rem, 5.4vw, 5.25rem) !important;
  line-height: 1.03 !important;
  max-width: 17ch !important;
}

html body #header .search-widget::before,
html body #header #search_widget::before,
html body #header .elementor-widget-search::before,
html body #header .elementor-search__container::before {
  border: 2px solid #102417 !important;
  border-radius: 50% !important;
  content: "" !important;
  height: 13px !important;
  left: 1.05rem !important;
  opacity: .72 !important;
  pointer-events: none !important;
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-58%) !important;
  width: 13px !important;
  z-index: 3 !important;
}

html body #header .search-widget::after,
html body #header #search_widget::after,
html body #header .elementor-widget-search::after,
html body #header .elementor-search__container::after {
  background: #102417 !important;
  content: "" !important;
  height: 8px !important;
  left: 1.92rem !important;
  opacity: .72 !important;
  pointer-events: none !important;
  position: absolute !important;
  top: 52% !important;
  transform: rotate(45deg) !important;
  width: 2px !important;
  z-index: 3 !important;
}

html body #header input[type="search"],
html body #header input[name="s"],
html body #header input[name="search_query"],
html body #header .elementor-search__input {
  padding-left: 3.25rem !important;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  html body#index #bb-home .bbh-hero-copy {
    animation: bbHomeRise .7s cubic-bezier(.2, .75, .2, 1) both;
  }

  html body#index #bb-home .bbh-category img,
  html body#index #bb-home .bbh-product-grid img {
    transition: filter .32s ease, transform .32s ease !important;
  }

  html body#index #bb-home .bbh-category:hover img,
  html body#index #bb-home .bbh-product-grid a:hover img {
    filter: saturate(1.04) contrast(1.03) !important;
    transform: scale(1.018);
  }
}

@keyframes bbHomeRise {
  from {
    opacity: .01;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 767px) {
  html body#index #bb-home .bbh-hero h1 {
    font-size: clamp(2.55rem, 10vw, 3.25rem) !important;
    line-height: 1.08 !important;
    max-width: 13ch !important;
  }

  html body #header .search-widget,
  html body #header #search_widget,
  html body #header .elementor-widget-search,
  html body #header .elementor-search-form,
  html body #header .elementor-search__container {
    display: none !important;
  }
}

/* BioBoske v11.2: dark bands must stay readable and elegant */
html body#index #bb-home .bbh-loyalty .bb-kicker,
html body#index #bb-home .bbh-assurance .bb-kicker {
  color: #d7e65a !important;
}

html body#index #bb-home .bbh-loyalty h2,
html body#index #bb-home .bbh-assurance h2 {
  color: #fffdf8 !important;
  text-shadow: 0 18px 48px rgba(0, 0, 0, .28) !important;
}

html body#index #bb-home .bbh-loyalty p,
html body#index #bb-home .bbh-assurance > p,
html body#index #bb-home .bbh-assurance-inner > p {
  color: rgba(255, 253, 248, .86) !important;
}

@media (max-width: 767px) {
  html body#index #bb-home .bbh-loyalty h2,
  html body#index #bb-home .bbh-assurance h2 {
    font-size: clamp(2rem, 8.6vw, 2.65rem) !important;
    line-height: 1.1 !important;
  }
}

/* BioBoske v11.3: loyalty band locked for contrast, rhythm and elegance */
html body#index #bb-home section.bbh-loyalty,
html body.page-index #bb-home section.bbh-loyalty,
#bb-home section.bbh-loyalty {
  align-items: center !important;
  background:
    radial-gradient(circle at 82% 18%, rgba(200, 223, 67, .14), transparent 22rem),
    radial-gradient(circle at 18% 82%, rgba(159, 122, 37, .12), transparent 20rem),
    linear-gradient(135deg, #073d26 0%, #042818 100%) !important;
  border: 0 !important;
  color: #fffdf8 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  position: relative !important;
  scroll-margin-top: 150px !important;
}

html body#index #bb-home section.bbh-loyalty::before,
html body.page-index #bb-home section.bbh-loyalty::before,
#bb-home section.bbh-loyalty::before {
  background:
    linear-gradient(90deg, rgba(255, 253, 248, .13), transparent 42%),
    linear-gradient(180deg, rgba(255, 253, 248, .08), transparent 34%);
  content: "" !important;
  inset: 0 !important;
  opacity: .5 !important;
  pointer-events: none !important;
  position: absolute !important;
  z-index: -1 !important;
}

html body#index #bb-home .bbh-loyalty-copy,
html body.page-index #bb-home .bbh-loyalty-copy,
#bb-home .bbh-loyalty-copy {
  max-width: 650px !important;
}

html body#index #bb-home .bbh-loyalty-copy .bb-kicker,
html body.page-index #bb-home .bbh-loyalty-copy .bb-kicker,
#bb-home .bbh-loyalty-copy .bb-kicker {
  color: #d8ea54 !important;
  opacity: 1 !important;
}

html body#index #bb-home .bbh-loyalty-copy h2,
html body#index #bb-home .bbh-loyalty-copy #bbh-loyalty-title,
html body.page-index #bb-home .bbh-loyalty-copy h2,
#bb-home .bbh-loyalty-copy h2 {
  color: #fffdf8 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.65rem, 4.8vw, 4.85rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1.02 !important;
  margin: .65rem 0 1.15rem !important;
  max-width: 14.5ch !important;
  opacity: 1 !important;
  text-shadow: 0 18px 48px rgba(0, 0, 0, .38) !important;
}

html body#index #bb-home .bbh-loyalty-copy p,
html body.page-index #bb-home .bbh-loyalty-copy p,
#bb-home .bbh-loyalty-copy p {
  color: rgba(255, 253, 248, .9) !important;
  font-size: clamp(1rem, 1.15vw, 1.12rem) !important;
  font-weight: 700 !important;
  line-height: 1.78 !important;
  margin: 0 !important;
  max-width: 43rem !important;
  opacity: 1 !important;
}

html body#index #bb-home .bbh-loyalty-proof,
html body.page-index #bb-home .bbh-loyalty-proof,
#bb-home .bbh-loyalty-proof {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .65rem !important;
  margin-top: clamp(1.35rem, 2.4vw, 2rem) !important;
}

html body#index #bb-home .bbh-loyalty-proof span,
html body.page-index #bb-home .bbh-loyalty-proof span,
#bb-home .bbh-loyalty-proof span {
  background: rgba(255, 253, 248, .1) !important;
  border: 1px solid rgba(255, 253, 248, .24) !important;
  border-radius: 999px !important;
  color: #fffdf8 !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
  padding: .55rem .8rem !important;
  text-transform: uppercase !important;
}

html body#index #bb-home .bbh-loyalty-card,
html body.page-index #bb-home .bbh-loyalty-card,
#bb-home .bbh-loyalty-card {
  background: #fffdf8 !important;
  border: 1px solid rgba(255, 253, 248, .22) !important;
  border-radius: 18px !important;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .24) !important;
  color: #102417 !important;
  min-height: 0 !important;
  padding: clamp(1.6rem, 3.2vw, 2.45rem) !important;
}

html body#index #bb-home .bbh-loyalty-card span,
html body.page-index #bb-home .bbh-loyalty-card span,
#bb-home .bbh-loyalty-card span {
  color: #9f7a25 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.7rem, 4.3vw, 4rem) !important;
  line-height: .95 !important;
}

html body#index #bb-home .bbh-loyalty-card strong,
html body.page-index #bb-home .bbh-loyalty-card strong,
#bb-home .bbh-loyalty-card strong {
  color: #102417 !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
}

html body#index #bb-home .bbh-loyalty-card p,
html body.page-index #bb-home .bbh-loyalty-card p,
#bb-home .bbh-loyalty-card p {
  color: #53635a !important;
  font-weight: 600 !important;
  line-height: 1.72 !important;
  margin: .85rem 0 1.45rem !important;
  opacity: 1 !important;
}

html body#index #bb-home .bbh-loyalty-card a,
html body.page-index #bb-home .bbh-loyalty-card a,
#bb-home .bbh-loyalty-card a {
  background: #c8df43 !important;
  color: #102417 !important;
}

@media (max-width: 900px) {
  html body#index #bb-home section.bbh-loyalty,
  html body.page-index #bb-home section.bbh-loyalty,
  #bb-home section.bbh-loyalty {
    gap: 1.5rem !important;
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 767px) {
  html body#index #bb-home .bbh-loyalty-copy h2,
  html body#index #bb-home .bbh-loyalty-copy #bbh-loyalty-title,
  html body.page-index #bb-home .bbh-loyalty-copy h2,
  #bb-home .bbh-loyalty-copy h2 {
    font-size: clamp(2.2rem, 9vw, 3rem) !important;
    line-height: 1.08 !important;
    max-width: 100% !important;
  }
}

/* BioBoske v11.4: living Amazon archive inspired by curated editorial systems */
html body#index #bb-home .bbh-archive,
html body.page-index #bb-home .bbh-archive,
#bb-home .bbh-archive {
  background:
    linear-gradient(90deg, rgba(3, 22, 13, .96), rgba(5, 45, 27, .86)),
    url("/img/cms/Home/morona.webp") center / cover no-repeat !important;
  color: #fffdf8 !important;
  display: grid !important;
  gap: clamp(1.6rem, 4vw, 4rem) !important;
  grid-template-columns: minmax(0, .92fr) minmax(360px, 1.08fr) !important;
  isolation: isolate !important;
  overflow: hidden !important;
  padding: clamp(4.8rem, 8vw, 8rem) clamp(1.2rem, 6vw, 5rem) !important;
  position: relative !important;
}

html body#index #bb-home .bbh-archive::before,
html body.page-index #bb-home .bbh-archive::before,
#bb-home .bbh-archive::before {
  background:
    radial-gradient(circle at 20% 28%, rgba(200, 223, 67, .2), transparent 20rem),
    radial-gradient(circle at 86% 72%, rgba(159, 122, 37, .16), transparent 24rem),
    linear-gradient(180deg, rgba(255, 253, 248, .09), transparent 32%) !important;
  content: "" !important;
  inset: 0 !important;
  opacity: .85 !important;
  pointer-events: none !important;
  position: absolute !important;
  z-index: -2 !important;
}

html body#index #bb-home .bbh-archive::after,
html body.page-index #bb-home .bbh-archive::after,
#bb-home .bbh-archive::after {
  background-image:
    linear-gradient(rgba(255, 253, 248, .1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 253, 248, .08) 1px, transparent 1px) !important;
  background-size: 88px 88px !important;
  content: "" !important;
  inset: 0 !important;
  mix-blend-mode: screen !important;
  opacity: .13 !important;
  pointer-events: none !important;
  position: absolute !important;
  z-index: -1 !important;
}

html body#index #bb-home .bbh-archive-copy,
html body.page-index #bb-home .bbh-archive-copy,
#bb-home .bbh-archive-copy {
  align-self: center !important;
  max-width: 560px !important;
  position: relative !important;
  z-index: 2 !important;
}

html body#index #bb-home .bbh-archive .bb-kicker,
html body.page-index #bb-home .bbh-archive .bb-kicker,
#bb-home .bbh-archive .bb-kicker {
  color: #d8ea54 !important;
}

html body#index #bb-home .bbh-archive h2,
html body.page-index #bb-home .bbh-archive h2,
#bb-home .bbh-archive h2 {
  color: #fffdf8 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.65rem, 4.8vw, 4.8rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1.02 !important;
  margin: .7rem 0 1.15rem !important;
  max-width: 13.5ch !important;
  text-shadow: 0 20px 56px rgba(0, 0, 0, .42) !important;
  text-wrap: balance !important;
}

html body#index #bb-home .bbh-archive-copy p,
html body.page-index #bb-home .bbh-archive-copy p,
#bb-home .bbh-archive-copy p {
  color: rgba(255, 253, 248, .9) !important;
  font-size: clamp(1rem, 1.14vw, 1.12rem) !important;
  font-weight: 700 !important;
  line-height: 1.78 !important;
  margin: 0 !important;
  max-width: 38rem !important;
}

html body#index #bb-home .bbh-archive-board,
html body.page-index #bb-home .bbh-archive-board,
#bb-home .bbh-archive-board {
  display: grid !important;
  gap: .85rem !important;
  position: relative !important;
  z-index: 2 !important;
}

html body#index #bb-home .bbh-archive-board article,
html body.page-index #bb-home .bbh-archive-board article,
#bb-home .bbh-archive-board article {
  backdrop-filter: blur(16px) saturate(1.05) !important;
  background: rgba(255, 253, 248, .92) !important;
  border: 1px solid rgba(255, 253, 248, .38) !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 72px rgba(0, 0, 0, .14) !important;
  color: #102417 !important;
  display: grid !important;
  gap: .4rem !important;
  grid-template-columns: 8.5rem minmax(0, .65fr) minmax(0, 1.35fr) !important;
  min-height: 120px !important;
  padding: clamp(1.05rem, 2vw, 1.45rem) !important;
  position: relative !important;
  transition: background-color .28s ease, box-shadow .28s ease, transform .28s ease !important;
}

html body#index #bb-home .bbh-archive-board article::before,
html body.page-index #bb-home .bbh-archive-board article::before,
#bb-home .bbh-archive-board article::before {
  background: linear-gradient(180deg, #c8df43, rgba(159, 122, 37, .72)) !important;
  border-radius: 999px !important;
  content: "" !important;
  height: calc(100% - 2rem) !important;
  left: .65rem !important;
  opacity: .75 !important;
  position: absolute !important;
  top: 1rem !important;
  width: 3px !important;
}

html body#index #bb-home .bbh-archive-board article span,
html body.page-index #bb-home .bbh-archive-board article span,
#bb-home .bbh-archive-board article span {
  color: #9f7a25 !important;
  font-size: .74rem !important;
  font-weight: 900 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
}

html body#index #bb-home .bbh-archive-board article strong,
html body.page-index #bb-home .bbh-archive-board article strong,
#bb-home .bbh-archive-board article strong {
  color: #102417 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(1.55rem, 2.2vw, 2.25rem) !important;
  font-weight: 600 !important;
  line-height: 1.05 !important;
}

html body#index #bb-home .bbh-archive-board article p,
html body.page-index #bb-home .bbh-archive-board article p,
#bb-home .bbh-archive-board article p {
  color: #53635a !important;
  font-size: .98rem !important;
  font-weight: 600 !important;
  line-height: 1.62 !important;
  margin: 0 !important;
}

html body#index #bb-home .bbh-archive-leaf,
html body.page-index #bb-home .bbh-archive-leaf,
#bb-home .bbh-archive-leaf {
  background:
    radial-gradient(ellipse at 42% 28%, rgba(216, 234, 84, .36), transparent 34%),
    linear-gradient(135deg, rgba(216, 234, 84, .28), rgba(255, 253, 248, .04)) !important;
  border: 1px solid rgba(216, 234, 84, .18) !important;
  border-radius: 58% 42% 64% 36% / 42% 62% 38% 58% !important;
  filter: blur(.15px) !important;
  opacity: .38 !important;
  pointer-events: none !important;
  position: absolute !important;
  transform: rotate(-16deg) !important;
  z-index: 0 !important;
}

html body#index #bb-home .bbh-archive-leaf-a,
html body.page-index #bb-home .bbh-archive-leaf-a,
#bb-home .bbh-archive-leaf-a {
  height: 210px !important;
  left: -70px !important;
  top: 16% !important;
  width: 150px !important;
}

html body#index #bb-home .bbh-archive-leaf-b,
html body.page-index #bb-home .bbh-archive-leaf-b,
#bb-home .bbh-archive-leaf-b {
  bottom: 10% !important;
  height: 260px !important;
  right: -82px !important;
  transform: rotate(24deg) !important;
  width: 190px !important;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  html body#index #bb-home .bbh-archive::before,
  html body.page-index #bb-home .bbh-archive::before,
  #bb-home .bbh-archive::before {
    animation: bbhForestGlow 12s ease-in-out infinite alternate !important;
  }

  html body#index #bb-home .bbh-archive-leaf-a,
  html body.page-index #bb-home .bbh-archive-leaf-a,
  #bb-home .bbh-archive-leaf-a {
    animation: bbhLeafDriftA 13s ease-in-out infinite alternate !important;
  }

  html body#index #bb-home .bbh-archive-leaf-b,
  html body.page-index #bb-home .bbh-archive-leaf-b,
  #bb-home .bbh-archive-leaf-b {
    animation: bbhLeafDriftB 15s ease-in-out infinite alternate !important;
  }

  html body#index #bb-home .bbh-archive-board article:hover,
  html body.page-index #bb-home .bbh-archive-board article:hover,
  #bb-home .bbh-archive-board article:hover {
    background: #fffdf8 !important;
    box-shadow: 0 30px 86px rgba(0, 0, 0, .2) !important;
    transform: translateX(6px) !important;
  }
}

@keyframes bbhForestGlow {
  from {
    opacity: .72;
    transform: translate3d(-1.2%, 0, 0) scale(1);
  }
  to {
    opacity: .92;
    transform: translate3d(1.2%, -1.2%, 0) scale(1.025);
  }
}

@keyframes bbhLeafDriftA {
  from { transform: translate3d(0, 0, 0) rotate(-16deg); }
  to { transform: translate3d(18px, -20px, 0) rotate(-8deg); }
}

@keyframes bbhLeafDriftB {
  from { transform: translate3d(0, 0, 0) rotate(24deg); }
  to { transform: translate3d(-22px, 18px, 0) rotate(16deg); }
}

@media (max-width: 900px) {
  html body#index #bb-home .bbh-archive,
  html body.page-index #bb-home .bbh-archive,
  #bb-home .bbh-archive {
    grid-template-columns: 1fr !important;
  }

  html body#index #bb-home .bbh-archive-board article,
  html body.page-index #bb-home .bbh-archive-board article,
  #bb-home .bbh-archive-board article {
    grid-template-columns: 1fr !important;
    padding-left: 1.3rem !important;
  }
}

@media (max-width: 767px) {
  html body#index #bb-home .bbh-archive,
  html body.page-index #bb-home .bbh-archive,
  #bb-home .bbh-archive {
    padding: 4rem 1rem !important;
  }

  html body#index #bb-home .bbh-archive h2,
  html body.page-index #bb-home .bbh-archive h2,
  #bb-home .bbh-archive h2 {
    font-size: clamp(2.15rem, 9vw, 3rem) !important;
    line-height: 1.08 !important;
    max-width: 100% !important;
  }

  html body#index #bb-home .bbh-archive-copy p,
  html body.page-index #bb-home .bbh-archive-copy p,
  #bb-home .bbh-archive-copy p {
    font-size: .98rem !important;
    line-height: 1.68 !important;
  }

  html body#index #bb-home .bbh-archive-board article,
  html body.page-index #bb-home .bbh-archive-board article,
  #bb-home .bbh-archive-board article {
    border-radius: 16px !important;
    min-height: 0 !important;
  }
}

/* BioBoske v11.6: restrained luminous atmosphere */
html body :where(#bb-home, #caf-page, #san-catalog, #ker-catalog, #bb-clean-product, #ker-gallery) {
  isolation: isolate;
}

html body :where(
  #bb-home .bbh-origin,
  #bb-home .bbh-products,
  #bb-home .bbh-impact,
  #bb-home .bbh-assurance,
  #caf-page .caf-s2,
  #caf-page .caf-s3,
  #caf-page .caf-s4,
  #san-catalog .san-values,
  #san-catalog .san-proceso,
  #san-catalog .san-grid-wrap,
  #ker-catalog .ker-grid-wrap,
  #bb-clean-product,
  #ker-gallery
) {
  overflow: hidden;
  position: relative;
}

html body :where(
  #bb-home .bbh-origin,
  #bb-home .bbh-products,
  #bb-home .bbh-impact,
  #bb-home .bbh-assurance,
  #caf-page .caf-s2,
  #caf-page .caf-s3,
  #caf-page .caf-s4,
  #san-catalog .san-values,
  #san-catalog .san-proceso,
  #san-catalog .san-grid-wrap,
  #ker-catalog .ker-grid-wrap,
  #bb-clean-product,
  #ker-gallery
) > * {
  position: relative;
  z-index: 1;
}

html body :where(
  #bb-home .bbh-origin,
  #bb-home .bbh-products,
  #bb-home .bbh-impact,
  #bb-home .bbh-assurance,
  #caf-page .caf-s2,
  #caf-page .caf-s3,
  #caf-page .caf-s4,
  #san-catalog .san-values,
  #san-catalog .san-proceso,
  #san-catalog .san-grid-wrap,
  #ker-catalog .ker-grid-wrap,
  #bb-clean-product,
  #ker-gallery
)::after {
  background:
    radial-gradient(ellipse 48% 64% at var(--bb-light-x, 88%) var(--bb-light-y, 18%), rgba(255, 253, 248, .72), transparent 68%),
    radial-gradient(ellipse 38% 52% at var(--bb-moss-x, 10%) var(--bb-moss-y, 82%), rgba(197, 230, 23, .11), transparent 70%);
  content: "";
  inset: 0;
  opacity: var(--bb-atmos-opacity, .22);
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

html body #bb-home .bbh-products,
html body #san-catalog .san-grid-wrap,
html body #ker-catalog .ker-grid-wrap {
  --bb-atmos-opacity: .18;
  --bb-light-x: 8%;
  --bb-light-y: 18%;
  --bb-moss-x: 92%;
  --bb-moss-y: 76%;
}

html body #bb-home .bbh-impact,
html body #bb-home .bbh-assurance,
html body #caf-page .caf-s4 {
  --bb-atmos-opacity: .2;
  --bb-light-x: 86%;
  --bb-light-y: 68%;
  --bb-moss-x: 16%;
  --bb-moss-y: 22%;
}

html body #bb-clean-product,
html body #ker-gallery {
  --bb-atmos-opacity: .13;
  --bb-light-x: 84%;
  --bb-light-y: 16%;
  --bb-moss-x: 8%;
  --bb-moss-y: 78%;
}

html body :where(
  #bb-home .bbh-category,
  #bb-home .bbh-product-grid a,
  #bb-home .bbh-impact-card,
  #bb-home .bbh-assurance-card,
  #san-catalog .san-card,
  #ker-catalog .ker-card,
  #caf-page .caf-s3,
  #ker-gallery .kg-stage
) {
  background-image:
    linear-gradient(135deg, rgba(255, 253, 248, .16), transparent 38%),
    radial-gradient(circle at 12% 14%, rgba(197, 230, 23, .08), transparent 12rem);
  background-blend-mode: screen, normal;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  html body :where(
    #bb-home .bbh-hero-bg,
    #caf-page .caf-s1-img,
    #san-catalog .bb-hero-bg,
    #ker-catalog .bb-hero-bg
  ) {
    animation: bbSlowJungleBreath 24s ease-in-out infinite alternate;
    transform-origin: center;
    will-change: transform;
  }

  html body :where(
    #bb-home .bbh-origin,
    #bb-home .bbh-products,
    #bb-home .bbh-impact,
    #bb-home .bbh-assurance,
    #caf-page .caf-s2,
    #caf-page .caf-s3,
    #caf-page .caf-s4,
    #san-catalog .san-values,
    #san-catalog .san-proceso,
    #san-catalog .san-grid-wrap,
    #ker-catalog .ker-grid-wrap,
    #bb-clean-product,
    #ker-gallery
  )::after {
    animation: bbLuminousAtmosphere 18s ease-in-out infinite alternate;
  }

  html body :where(
    #bb-home .bbh-category,
    #bb-home .bbh-product-grid a,
    #bb-home .bbh-impact-card,
    #bb-home .bbh-assurance-card,
    #san-catalog .san-card,
    #ker-catalog .ker-card
  ) {
    transition:
      box-shadow .32s ease,
      filter .32s ease,
      transform .32s ease;
  }

  html body :where(
    #bb-home .bbh-category:hover,
    #bb-home .bbh-product-grid a:hover,
    #bb-home .bbh-impact-card:hover,
    #bb-home .bbh-assurance-card:hover,
    #san-catalog .san-card:hover,
    #ker-catalog .ker-card:hover
  ) {
    filter: saturate(1.04);
    transform: translateY(-4px);
  }
}

@keyframes bbSlowJungleBreath {
  from { transform: scale(1.01) translate3d(0, 0, 0); }
  to { transform: scale(1.055) translate3d(-1.2%, .9%, 0); }
}

@keyframes bbLuminousAtmosphere {
  from {
    opacity: .1;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: var(--bb-atmos-opacity, .22);
    transform: translate3d(-10px, 8px, 0);
  }
}

/* BioBoske v11.7: intentional rainforest depth */
html body#index #bb-home .bbh-impact,
html body#index #bb-home .bbh-assurance,
html body#index #bb-home .bbh-origin,
html body#index #bb-home .bbh-products,
html body#index #bb-home .bbh-categories {
  background-color: #fffdf8 !important;
}

html body :where(.bbh-hero, .caf-s1, #san-catalog .san-hero, #ker-catalog .ker-header-bar) {
  overflow: hidden !important;
}

html body :where(.bbh-hero, .caf-s1, #san-catalog .san-hero, #ker-catalog .ker-header-bar)::after {
  background:
    radial-gradient(ellipse 42% 54% at 82% 14%, rgba(197, 230, 23, .14), transparent 70%),
    radial-gradient(ellipse 42% 52% at 8% 84%, rgba(5, 31, 18, .32), transparent 72%);
  content: "";
  inset: 0;
  mix-blend-mode: screen;
  opacity: .34;
  pointer-events: none;
  position: absolute;
  z-index: 2;
}

html body :where(
  #bb-home .bbh-origin,
  #bb-home .bbh-products,
  #bb-home .bbh-impact,
  #bb-home .bbh-assurance,
  #caf-page .caf-s2,
  #caf-page .caf-s3,
  #caf-page .caf-s4,
  #san-catalog .san-grid-wrap,
  #ker-catalog .ker-grid-wrap,
  #bb-clean-product,
  #ker-gallery
)::before {
  background:
    radial-gradient(ellipse 34% 46% at 86% 12%, rgba(11, 111, 60, .08), transparent 72%),
    radial-gradient(ellipse 38% 50% at 12% 88%, rgba(197, 230, 23, .07), transparent 74%);
  content: "";
  inset: 0;
  opacity: .46;
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

html body :where(
  #bb-home .bbh-origin,
  #bb-home .bbh-products,
  #bb-home .bbh-impact,
  #bb-home .bbh-assurance,
  #caf-page .caf-s2,
  #caf-page .caf-s3,
  #caf-page .caf-s4,
  #san-catalog .san-grid-wrap,
  #ker-catalog .ker-grid-wrap,
  #bb-clean-product,
  #ker-gallery
) > * {
  position: relative;
  z-index: 1;
}

html body :where(
  .bbh-path article,
  .bbh-category,
  .bbh-product-grid a,
  .bbh-impact-card,
  .bbh-assurance-card,
  .san-card,
  .ker-card
) {
  box-shadow:
    inset 0 1px 0 rgba(255, 253, 248, .5),
    0 18px 48px rgba(5, 31, 18, .07) !important;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  html body :where(.bbh-hero, .caf-s1, #san-catalog .san-hero, #ker-catalog .ker-header-bar)::after {
    animation: bbCanopyLight 20s ease-in-out infinite alternate;
  }

  html body :where(
    #bb-home .bbh-origin,
    #bb-home .bbh-products,
    #bb-home .bbh-impact,
    #bb-home .bbh-assurance,
    #caf-page .caf-s2,
    #caf-page .caf-s3,
    #caf-page .caf-s4,
    #san-catalog .san-grid-wrap,
    #ker-catalog .ker-grid-wrap,
    #bb-clean-product,
    #ker-gallery
  )::before {
    animation: bbPaperMist 24s ease-in-out infinite alternate;
  }
}

@keyframes bbCanopyLight {
  from {
    opacity: .24;
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    opacity: .38;
    transform: translate3d(-10px, 8px, 0) scale(1.025);
  }
}

@keyframes bbPaperMist {
  from {
    opacity: .3;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: .48;
    transform: translate3d(8px, -6px, 0);
  }
}

/* BioBoske v11.8: repair assurance readability */
html body#index #bb-home .bbh-assurance,
html body.page-index #bb-home .bbh-assurance,
#bb-home .bbh-assurance {
  background:
    radial-gradient(ellipse 42% 52% at 88% 12%, rgba(11, 111, 60, .08), transparent 70%),
    radial-gradient(ellipse 34% 44% at 8% 92%, rgba(197, 230, 23, .07), transparent 74%),
    linear-gradient(180deg, #fffdf8 0%, #fbf8f1 100%) !important;
  color: #102417 !important;
}

html body#index #bb-home .bbh-assurance::before,
html body#index #bb-home .bbh-assurance::after,
html body.page-index #bb-home .bbh-assurance::before,
html body.page-index #bb-home .bbh-assurance::after,
#bb-home .bbh-assurance::before,
#bb-home .bbh-assurance::after {
  content: none !important;
  display: none !important;
}

html body#index #bb-home .bbh-assurance .bbh-assurance-inner,
html body.page-index #bb-home .bbh-assurance .bbh-assurance-inner,
#bb-home .bbh-assurance .bbh-assurance-inner {
  position: relative !important;
  z-index: 1 !important;
}

html body#index #bb-home .bbh-assurance .bb-kicker,
html body.page-index #bb-home .bbh-assurance .bb-kicker,
#bb-home .bbh-assurance .bb-kicker {
  color: #0b6f3c !important;
  text-shadow: none !important;
}

html body#index #bb-home .bbh-assurance h2,
html body.page-index #bb-home .bbh-assurance h2,
#bb-home .bbh-assurance h2 {
  color: #102417 !important;
  text-shadow: none !important;
}

html body#index #bb-home .bbh-assurance > p,
html body#index #bb-home .bbh-assurance .bbh-assurance-inner > p,
html body.page-index #bb-home .bbh-assurance > p,
html body.page-index #bb-home .bbh-assurance .bbh-assurance-inner > p,
#bb-home .bbh-assurance > p,
#bb-home .bbh-assurance .bbh-assurance-inner > p {
  color: #4f5d54 !important;
  text-shadow: none !important;
}

html body#index #bb-home .bbh-assurance-card,
html body.page-index #bb-home .bbh-assurance-card,
#bb-home .bbh-assurance-card {
  background: rgba(255, 253, 248, .96) !important;
  border: 1px solid rgba(18, 48, 31, .12) !important;
  box-shadow: 0 18px 48px rgba(5, 31, 18, .08) !important;
  color: #102417 !important;
}

html body#index #bb-home .bbh-assurance-card::before,
html body#index #bb-home .bbh-assurance-card::after,
html body.page-index #bb-home .bbh-assurance-card::before,
html body.page-index #bb-home .bbh-assurance-card::after,
#bb-home .bbh-assurance-card::before,
#bb-home .bbh-assurance-card::after {
  content: none !important;
  display: none !important;
}

html body#index #bb-home .bbh-assurance-card span,
html body.page-index #bb-home .bbh-assurance-card span,
#bb-home .bbh-assurance-card span {
  color: #9f7a25 !important;
}

html body#index #bb-home .bbh-assurance-card strong,
html body.page-index #bb-home .bbh-assurance-card strong,
#bb-home .bbh-assurance-card strong {
  color: #102417 !important;
}

html body#index #bb-home .bbh-assurance-card p,
html body.page-index #bb-home .bbh-assurance-card p,
#bb-home .bbh-assurance-card p {
  color: #53635a !important;
}

/* BioBoske v11.9: territorial identity for the impact section */
html body#index #bb-home .bbh-impact,
html body.page-index #bb-home .bbh-impact,
#bb-home .bbh-impact {
  background:
    radial-gradient(ellipse 44% 62% at 86% 16%, rgba(11, 111, 60, .08), transparent 72%),
    radial-gradient(ellipse 36% 46% at 7% 88%, rgba(159, 122, 37, .08), transparent 74%),
    linear-gradient(180deg, #fffdf8 0%, #fbf8f1 100%) !important;
  border-bottom: 1px solid rgba(18, 48, 31, .08) !important;
  border-top: 1px solid rgba(18, 48, 31, .08) !important;
  color: #102417 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  position: relative !important;
}

html body#index #bb-home .bbh-impact::before,
html body.page-index #bb-home .bbh-impact::before,
#bb-home .bbh-impact::before {
  animation: none !important;
  background:
    repeating-radial-gradient(ellipse at 82% 21%, rgba(16, 36, 23, .13) 0 1px, transparent 1px 26px),
    linear-gradient(118deg, transparent 0 58%, rgba(11, 111, 60, .08) 58.2% 58.45%, transparent 58.7%),
    linear-gradient(116deg, transparent 0 64%, rgba(159, 122, 37, .1) 64.1% 64.35%, transparent 64.6%);
  content: "" !important;
  display: block !important;
  inset: 0 !important;
  opacity: .48 !important;
  pointer-events: none !important;
  position: absolute !important;
  transform: none !important;
  z-index: 0 !important;
  -webkit-mask-image: radial-gradient(ellipse at 82% 20%, #000 0 34%, transparent 70%);
  mask-image: radial-gradient(ellipse at 82% 20%, #000 0 34%, transparent 70%);
}

html body#index #bb-home .bbh-impact::after,
html body.page-index #bb-home .bbh-impact::after,
#bb-home .bbh-impact::after {
  animation: none !important;
  background:
    linear-gradient(90deg, rgba(11, 111, 60, .22), rgba(159, 122, 37, .16), transparent),
    linear-gradient(180deg, transparent, rgba(255, 253, 248, .72), transparent);
  content: "" !important;
  display: block !important;
  height: 1px !important;
  left: clamp(1rem, 5vw, 4rem) !important;
  opacity: .9 !important;
  pointer-events: none !important;
  position: absolute !important;
  right: clamp(1rem, 5vw, 4rem) !important;
  top: clamp(1.2rem, 2.4vw, 2rem) !important;
  transform: none !important;
  z-index: 1 !important;
}

html body#index #bb-home .bbh-impact-inner,
html body.page-index #bb-home .bbh-impact-inner,
#bb-home .bbh-impact-inner {
  position: relative !important;
  z-index: 2 !important;
}

html body#index #bb-home .bbh-impact .bb-kicker,
html body.page-index #bb-home .bbh-impact .bb-kicker,
#bb-home .bbh-impact .bb-kicker {
  align-items: center !important;
  color: #0b6f3c !important;
  display: inline-flex !important;
  gap: .7rem !important;
  letter-spacing: .12em !important;
}

html body#index #bb-home .bbh-impact .bb-kicker::before,
html body.page-index #bb-home .bbh-impact .bb-kicker::before,
#bb-home .bbh-impact .bb-kicker::before {
  background: linear-gradient(90deg, #0b6f3c, #9f7a25) !important;
  content: "" !important;
  display: block !important;
  flex: 0 0 auto !important;
  height: 1px !important;
  width: 2.4rem !important;
}

html body#index #bb-home .bbh-impact h2,
html body.page-index #bb-home .bbh-impact h2,
#bb-home .bbh-impact h2 {
  color: #102417 !important;
  max-width: 16.5ch !important;
  position: relative !important;
  text-shadow: none !important;
}

html body#index #bb-home .bbh-impact h2::after,
html body.page-index #bb-home .bbh-impact h2::after,
#bb-home .bbh-impact h2::after {
  background: linear-gradient(90deg, rgba(11, 111, 60, .9), rgba(159, 122, 37, .65), transparent) !important;
  content: "" !important;
  display: block !important;
  height: 2px !important;
  margin-top: clamp(.9rem, 1.6vw, 1.2rem) !important;
  width: min(9rem, 42%) !important;
}

html body#index #bb-home .bbh-impact > p,
html body#index #bb-home .bbh-impact .bbh-impact-inner > p,
html body.page-index #bb-home .bbh-impact > p,
html body.page-index #bb-home .bbh-impact .bbh-impact-inner > p,
#bb-home .bbh-impact > p,
#bb-home .bbh-impact .bbh-impact-inner > p {
  color: #4d5d54 !important;
  max-width: 60rem !important;
}

html body#index #bb-home .bbh-impact-grid,
html body.page-index #bb-home .bbh-impact-grid,
#bb-home .bbh-impact-grid {
  counter-reset: bbhImpact !important;
  gap: clamp(1rem, 2vw, 1.35rem) !important;
  margin-top: clamp(2rem, 3.8vw, 3.1rem) !important;
}

html body#index #bb-home .bbh-impact-card,
html body.page-index #bb-home .bbh-impact-card,
#bb-home .bbh-impact-card {
  background:
    linear-gradient(180deg, rgba(255, 253, 248, .98), rgba(248, 243, 233, .96)) !important;
  border: 1px solid rgba(18, 48, 31, .12) !important;
  border-radius: 8px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 253, 248, .9),
    0 22px 56px rgba(5, 31, 18, .08) !important;
  color: #102417 !important;
  counter-increment: bbhImpact !important;
  min-height: 208px !important;
  overflow: hidden !important;
  padding: clamp(1.35rem, 2.4vw, 1.8rem) !important;
  position: relative !important;
}

html body#index #bb-home .bbh-impact-card::before,
html body.page-index #bb-home .bbh-impact-card::before,
#bb-home .bbh-impact-card::before {
  background: linear-gradient(90deg, #0b6f3c, #9f7a25, rgba(159, 122, 37, 0)) !important;
  content: "" !important;
  display: block !important;
  height: 3px !important;
  left: 0 !important;
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
  z-index: 1 !important;
}

html body#index #bb-home .bbh-impact-card::after,
html body.page-index #bb-home .bbh-impact-card::after,
#bb-home .bbh-impact-card::after {
  color: rgba(16, 36, 23, .1) !important;
  content: "0" counter(bbhImpact) !important;
  display: block !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(3.2rem, 5vw, 4.8rem) !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  pointer-events: none !important;
  position: absolute !important;
  right: clamp(1rem, 2vw, 1.35rem) !important;
  top: clamp(.9rem, 1.8vw, 1.2rem) !important;
  z-index: 0 !important;
}

html body#index #bb-home .bbh-impact-card > *,
html body.page-index #bb-home .bbh-impact-card > *,
#bb-home .bbh-impact-card > * {
  position: relative !important;
  z-index: 2 !important;
}

html body#index #bb-home .bbh-impact-card span,
html body.page-index #bb-home .bbh-impact-card span,
#bb-home .bbh-impact-card span {
  color: #0b6f3c !important;
  padding-bottom: .48rem !important;
  position: relative !important;
  width: max-content !important;
}

html body#index #bb-home .bbh-impact-card span::after,
html body.page-index #bb-home .bbh-impact-card span::after,
#bb-home .bbh-impact-card span::after {
  background: rgba(159, 122, 37, .42) !important;
  bottom: 0 !important;
  content: "" !important;
  display: block !important;
  height: 1px !important;
  left: 0 !important;
  position: absolute !important;
  width: 100% !important;
}

html body#index #bb-home .bbh-impact-card strong,
html body.page-index #bb-home .bbh-impact-card strong,
#bb-home .bbh-impact-card strong {
  color: #102417 !important;
  font-size: clamp(1.06rem, 1.25vw, 1.18rem) !important;
  margin-top: 1.05rem !important;
}

html body#index #bb-home .bbh-impact-card p,
html body.page-index #bb-home .bbh-impact-card p,
#bb-home .bbh-impact-card p {
  color: #52645a !important;
  font-size: .98rem !important;
  line-height: 1.72 !important;
  margin-top: .78rem !important;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  html body#index #bb-home .bbh-impact-card:hover,
  html body.page-index #bb-home .bbh-impact-card:hover,
  #bb-home .bbh-impact-card:hover {
    border-color: rgba(11, 111, 60, .22) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 253, 248, .9),
      0 26px 62px rgba(5, 31, 18, .11) !important;
    transform: translateY(-4px) !important;
  }
}

@media (max-width: 767px) {
  html body#index #bb-home .bbh-impact::before,
  html body.page-index #bb-home .bbh-impact::before,
  #bb-home .bbh-impact::before {
    opacity: .32 !important;
    -webkit-mask-image: radial-gradient(ellipse at 86% 12%, #000 0 28%, transparent 62%);
    mask-image: radial-gradient(ellipse at 86% 12%, #000 0 28%, transparent 62%);
  }

  html body#index #bb-home .bbh-impact-card,
  html body.page-index #bb-home .bbh-impact-card,
  #bb-home .bbh-impact-card {
    min-height: 0 !important;
  }
}

/* BioBoske v12.0: mobile polish and faster first view */
@media (max-width: 767px) {
  html body {
    overflow-x: hidden !important;
  }

  html body #sanate-topbar,
  html body #header .header-banner,
  html body #header .header-nav {
    display: none !important;
  }

  html body #header {
    background: #fffdf8 !important;
    border-bottom: 1px solid rgba(11, 111, 60, .18) !important;
    box-shadow: 0 10px 28px rgba(5, 31, 18, .08) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
  }

  html body #header .header-top,
  html body #header .elementor-section,
  html body #header .elementor-container,
  html body #header .elementor-row {
    min-height: 74px !important;
  }

  html body #header .elementor-column-wrap,
  html body #header .elementor-widget-wrap {
    align-content: center !important;
    align-items: center !important;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
  }

  html body #header img[src*="logo-bioboske"] {
    height: auto !important;
    max-width: 42vw !important;
    width: 154px !important;
  }

  html body #header .elementor-widget-shopping-cart,
  html body #header [data-widget_type*="shopping-cart"],
  html body #header [data-widget_type*="user"],
  html body #header [data-widget_type*="login"],
  html body #header [data-widget_type*="account"] {
    display: none !important;
  }

  html body #header .elementor-icon,
  html body #header .elementor-button,
  html body #header .ybc-menu-toggle {
    align-items: center !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    justify-content: center !important;
    min-height: 40px !important;
    min-width: 40px !important;
  }

  html body #header .ybc-menu-toggle {
    background: transparent !important;
    color: #102417 !important;
    font-size: 0 !important;
    gap: 0 !important;
    padding: 0 !important;
  }

  html body #header .ybc-menu-toggle .icon-bar {
    background: #102417 !important;
    border-radius: 999px !important;
    display: block !important;
    height: 2px !important;
    margin: 4px 0 !important;
    width: 24px !important;
  }

  html body#index #bb-home .bbh-hero {
    border-radius: 0 0 22px 22px !important;
    min-height: min(590px, calc(100svh - 74px)) !important;
  }

  html body#index #bb-home .bbh-hero-copy {
    gap: .82rem !important;
    padding-bottom: 3.25rem !important;
    padding-top: 3.25rem !important;
  }

  html body#index #bb-home .bbh-hero h1 {
    font-size: clamp(2.95rem, 12vw, 3.65rem) !important;
    line-height: .96 !important;
    max-width: 9.8ch !important;
  }

  html body#index #bb-home .bbh-hero p {
    font-size: .96rem !important;
    line-height: 1.58 !important;
    max-width: 20.5rem !important;
  }

  html body#index #bb-home .bbh-actions {
    gap: .72rem !important;
  }

  html body#index #bb-home .bbh-actions a {
    min-height: 48px !important;
    padding: .82rem 1rem !important;
  }

  html body#index #bb-home section:not(.bbh-hero) {
    content-visibility: auto;
    contain-intrinsic-size: 720px;
  }

  html body.page-index .mi-slider-container,
  html body.page-index .mi-slider-container.bb-home-refined,
  html body.page-index.bb-home-origin-ready .mi-slider-container {
    background-image: none !important;
  }

  html body #sanate-whatsapp {
    bottom: .9rem !important;
    right: .9rem !important;
  }

  html body #sanate-whatsapp .wa-btn {
    min-height: 56px !important;
    min-width: 56px !important;
    padding: 0 !important;
  }

  html body #sanate-whatsapp .wa-label {
    display: none !important;
  }
}

/* BioBoske v12.1: final mobile compact header and lean first paint */
@media (max-width: 767px) {
  html body #header .elementor-element-22b6ec5 {
    display: none !important;
  }

  html body #header .elementor-element-8821f71,
  html body #header .elementor-element-252fafc,
  html body #header .header-top {
    height: 68px !important;
    min-height: 68px !important;
  }

  html body #header .elementor-element-8821f71 .elementor-container,
  html body #header .elementor-element-252fafc .elementor-container,
  html body #header .elementor-element-8821f71 .elementor-row,
  html body #header .elementor-element-252fafc .elementor-row {
    height: 68px !important;
    min-height: 68px !important;
  }

  html body #header img[src*="logo-bioboske"] {
    max-width: 38vw !important;
    width: 142px !important;
  }

  html body #header .elementor-widget-login,
  html body #header .elementor-widget-customer-signin,
  html body #header [class*="user-info"],
  html body #header a[href*="controller=authentication"],
  html body #header a[href*="controller=my-account"],
  html body #header a[href*="registration"] {
    display: none !important;
  }

  html body#index #bb-home .bbh-hero {
    min-height: min(600px, calc(100svh - 68px)) !important;
  }

  html body#index #bb-home .bbh-archive,
  html body.page-index #bb-home .bbh-archive,
  #bb-home .bbh-archive {
    background:
      linear-gradient(90deg, rgba(3, 22, 13, .96), rgba(5, 45, 27, .86)) !important;
  }

  html body.page-index .mi-slider-container,
  html body.page-index .mi-slider-container.bb-home-refined,
  html body.page-index.bb-home-origin-ready .mi-slider-container {
    background: none !important;
  }

  html body .wishlist-login,
  html body .modal-backdrop.fade,
  html body .modal-backdrop.show {
    display: none !important;
    pointer-events: none !important;
  }
}

/* ════════════════════════════════════════════════════════
   EXPORT ESTÁTICO — drawer móvil propio (#bb-mnav)
   El megamenu nativo no revela su panel en el export, así que
   usamos un drawer propio con namespace aislado. Sin conflicto
   de cascada ni dependencia del runtime PrestaShop.
   ════════════════════════════════════════════════════════ */
.ybc-menu-toggle { cursor: pointer; -webkit-tap-highlight-color: transparent; }

#bb-mnav-backdrop {
  position: fixed; inset: 0; z-index: 100000;
  background: rgba(7,25,14,.55);
  opacity: 0; visibility: hidden;
  transition: opacity .3s ease, visibility .3s;
}
#bb-mnav-backdrop.open { opacity: 1; visibility: visible; }

#bb-mnav {
  position: fixed; top: 0; bottom: 0; left: 0; z-index: 100001;
  width: 82vw; max-width: 300px;
  background: #0b3a22; color: #fff;
  transform: translateX(-100%);
  transition: transform .32s cubic-bezier(.4,0,.2,1);
  display: flex; flex-direction: column;
  box-shadow: 10px 0 50px rgba(0,0,0,.42);
  overflow-y: auto; -webkit-overflow-scrolling: touch;
}
#bb-mnav.open { transform: translateX(0); }

.bb-mnav-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.15rem 1.25rem;
  border-bottom: 1px solid rgba(255,255,255,.12);
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.45rem; font-weight: 600; letter-spacing: .02em;
}
.bb-mnav-x {
  background: none; border: none; color: #fff;
  font-size: 1.9rem; line-height: 1; cursor: pointer; padding: 0 .25rem;
}
.bb-mnav-links { display: flex; flex-direction: column; padding: .4rem 0; flex: 1 1 auto; }
.bb-mnav-links a {
  color: #fff !important; text-decoration: none;
  padding: .95rem 1.25rem; font-size: 1.02rem; font-weight: 500;
  border-bottom: 1px solid rgba(255,255,255,.07);
  transition: background .15s ease, padding-left .15s ease;
}
.bb-mnav-links a:hover, .bb-mnav-links a:active {
  background: rgba(255,255,255,.09); padding-left: 1.6rem;
}
.bb-mnav-wa {
  margin: 1rem 1.25rem .75rem; padding: .9rem; text-align: center;
  background: #25d366; color: #062f1d !important; font-weight: 700;
  border-radius: 8px; text-decoration: none; font-size: .95rem;
}
.bb-mnav-social {
  display: flex; justify-content: center; gap: .85rem;
  padding: .5rem 1.25rem 1.6rem;
  border-top: 1px solid rgba(255,255,255,.1);
  margin-top: .25rem; padding-top: 1.2rem;
}
.bb-mnav-social a {
  width: 40px; height: 40px; flex: 0 0 40px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: rgba(255,255,255,.1);
  color: #fff;
  transition: background .18s ease, transform .18s ease;
}
.bb-mnav-social a:hover, .bb-mnav-social a:active {
  background: var(--s-lima, #bacd42);
  color: #062f1d;
  transform: translateY(-2px);
}
.bb-mnav-social svg { width: 20px; height: 20px; display: block; }

/* Redes en el header de escritorio (reemplazan cuenta + carrito) */
.bb-header-social {
  display: flex; align-items: center; gap: .5rem;
}
.bb-header-social a {
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  color: var(--s-verde-osc, #07331f);
  background: rgba(7,51,31,.08);
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.bb-header-social a:hover {
  background: var(--s-verde, #0f6b39); color: #fff;
  transform: translateY(-2px);
}
.bb-header-social svg { width: 18px; height: 18px; display: block; }

/* Auspiciantes — reemplazan los logos de pago, en su mismo lugar.
   Sin fondo propio: heredan el color de esa fila del footer. */
#bb-sponsors {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: flex-end; gap: .7rem;
  background: transparent;
}
.bb-sponsors-label {
  font-size: .66rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: rgba(255,255,255,.7);
  white-space: nowrap;
}
.bb-sponsors-logos {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: .5rem;
}
.bb-sponsor {
  display: inline-flex; align-items: center; justify-content: center;
  background: #fff; border-radius: 7px;
  padding: .35rem .55rem;
  box-shadow: 0 2px 10px rgba(0,0,0,.16);
}
.bb-sponsor img {
  height: 30px !important; width: auto !important;
  max-height: 30px !important; max-width: 110px;
  object-fit: contain; display: block;
}
@media (max-width: 768px) {
  #bb-sponsors { justify-content: center; }
}
@media (max-width: 520px) {
  .bb-sponsor { padding: .3rem .5rem; }
  .bb-sponsor img { height: 26px !important; max-height: 26px !important; max-width: 92px; }
}

/* el drawer solo existe en móvil/tablet */
@media (min-width: 1025px) {
  #bb-mnav, #bb-mnav-backdrop { display: none !important; }
}
/* neutralizar el drawer nativo roto en móvil (se queda oculto) */
@media (max-width: 1024px) {
  .mm_menus_ul.active { visibility: hidden !important; }
}

/* ════════════════════════════════════════════════════════
   FLUIDEZ UX — reveal al hacer scroll, scroll suave, búsqueda
   ════════════════════════════════════════════════════════ */
html { scroll-behavior: smooth; }

@media (prefers-reduced-motion: no-preference) {
  .bb-reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .65s cubic-bezier(.2,.7,.2,1),
                transform .65s cubic-bezier(.2,.7,.2,1);
    will-change: opacity, transform;
  }
  .bb-reveal.bb-in { opacity: 1; transform: none; }
}

/* micro-interacción en cards (elevación suave al pasar/togar) */
.san-card, .ker-card, .san-bcard, .bbh-category {
  transition: transform .28s cubic-bezier(.2,.7,.2,1),
              box-shadow .28s cubic-bezier(.2,.7,.2,1);
}

/* Buscador propio (overlay) — funciona en todas las versiones */
#bb-search {
  position: fixed; inset: 0; z-index: 100050;
  background: rgba(7,25,14,.62);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  display: flex; align-items: flex-start; justify-content: center;
  padding: 13vh 1rem 0;
  opacity: 0; visibility: hidden;
  transition: opacity .25s ease, visibility .25s ease;
}
#bb-search.open { opacity: 1; visibility: visible; }
.bb-search-form {
  display: flex; align-items: center; gap: .5rem;
  width: 100%; max-width: 580px;
  background: #fff; border-radius: 14px;
  padding: .5rem .6rem .5rem 1.1rem;
  box-shadow: 0 28px 80px rgba(0,0,0,.45);
  transform: translateY(-14px);
  transition: transform .28s cubic-bezier(.2,.7,.2,1);
}
#bb-search.open .bb-search-form { transform: none; }
.bb-search-ico { width: 22px; height: 22px; color: var(--s-verde,#0f6b39); flex: 0 0 22px; }
.bb-search-input {
  flex: 1 1 auto; border: none; outline: none; background: transparent;
  font-size: 1.05rem; color: #102417; padding: .55rem .2rem; min-width: 0;
}
.bb-search-input::placeholder { color: #8a8a8a; }
.bb-search-go {
  flex: 0 0 auto; border: none; cursor: pointer;
  background: var(--s-verde,#0f6b39); color: #fff;
  font-weight: 700; font-size: .9rem; padding: .6rem 1.1rem; border-radius: 9px;
  transition: background .18s ease;
}
.bb-search-go:hover { background: var(--s-verde-osc,#07331f); }
.bb-search-x {
  flex: 0 0 auto; border: none; cursor: pointer; background: transparent;
  color: #6b6b6b; font-size: 1.7rem; line-height: 1; width: 40px; height: 44px;
}
@media (max-width: 480px) {
  .bb-search-go { padding: .6rem .8rem; }
  .bb-search-form { padding-left: .9rem; }
}

/* página de producto: fondo consistente (sin banda verde vacía) */
body.bb-product-clean,
body.bb-product-clean #wrapper,
body.bb-product-clean #content-wrapper,
body.bb-product-clean #main {
  background: #fbf8f1 !important;
}
body.bb-product-clean #bb-clean-product {
  padding-bottom: 0;
}

/* SANATE collection refresh: infusions only */
#san-catalog.sanate-page {
  --san-ink: #102417;
  --san-muted: #536359;
  --san-cream: #fbf8f1;
  --san-paper: #fffdf8;
  --san-green: #0b6f3c;
  --san-deep: #062f1d;
  --san-gold: #d9c94f;
  background:
    radial-gradient(circle at 14% 8%, rgba(217, 201, 79, .12), transparent 25%),
    radial-gradient(circle at 86% 34%, rgba(11, 111, 60, .08), transparent 28%),
    var(--san-cream) !important;
  color: var(--san-ink) !important;
  overflow: hidden !important;
}

#san-catalog.sanate-page .sanate-hero {
  min-height: clamp(620px, 74vw, 760px) !important;
  padding: clamp(3.6rem, 7vw, 6rem) clamp(1.15rem, 5vw, 4.75rem) !important;
}

#san-catalog.sanate-page .sanate-hero::before,
#san-catalog.sanate-page .sanate-hero::after {
  border: 1px solid rgba(255, 253, 248, .18);
  border-radius: 999px;
  content: "";
  position: absolute;
  z-index: -1;
}

#san-catalog.sanate-page .sanate-hero::before {
  height: 32rem;
  right: -10rem;
  top: -12rem;
  width: 32rem;
}

#san-catalog.sanate-page .sanate-hero::after {
  animation: sanateFloat 9s ease-in-out infinite;
  background: radial-gradient(circle, rgba(217, 201, 79, .17), transparent 62%);
  border: 0;
  bottom: 8%;
  height: 18rem;
  left: 44%;
  width: 18rem;
}

#san-catalog.sanate-page .bb-hero-shade {
  background:
    linear-gradient(90deg, rgba(4, 31, 18, .97) 0%, rgba(4, 31, 18, .9) 43%, rgba(4, 31, 18, .34) 72%, rgba(4, 31, 18, .74) 100%),
    radial-gradient(circle at 82% 18%, rgba(217, 201, 79, .18), transparent 31%) !important;
}

#san-catalog.sanate-page .san-hero-main {
  font-size: clamp(3.6rem, 7.2vw, 7.2rem) !important;
  max-width: 9.5ch !important;
}

#san-catalog.sanate-page .san-hero-xtra {
  color: #f1df73 !important;
  font-size: clamp(1.3rem, 2vw, 2rem) !important;
}

#san-catalog.sanate-page .sanate-hero-product {
  backdrop-filter: blur(16px);
  transform: rotate(.8deg);
}

#san-catalog.sanate-page .sanate-hero-product img {
  max-height: 420px !important;
}

#san-catalog.sanate-page .sanate-scent-strip {
  align-items: center;
  background: #071f14;
  border-bottom: 1px solid rgba(255, 253, 248, .1);
  border-top: 1px solid rgba(255, 253, 248, .1);
  color: #fffdf8;
  display: flex;
  flex-wrap: wrap;
  gap: .72rem;
  justify-content: center;
  padding: .95rem clamp(1rem, 4vw, 3rem);
}

#san-catalog.sanate-page .sanate-scent-strip span {
  border: 1px solid rgba(255, 253, 248, .18);
  border-radius: 999px;
  color: #edf6e8;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  padding: .52rem .82rem;
  text-transform: uppercase;
}

#san-catalog.sanate-page .sanate-products {
  padding: clamp(3.4rem, 6vw, 5.6rem) clamp(1rem, 4vw, 3.4rem) !important;
}

#san-catalog.sanate-page .sanate-section-head {
  margin: 0 auto clamp(1.8rem, 3.5vw, 2.8rem);
  max-width: 980px;
  text-align: center;
}

#san-catalog.sanate-page .sanate-section-head h2 {
  color: var(--san-ink) !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.7rem, 5vw, 5rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: .96 !important;
  margin: 0 auto .9rem !important;
  max-width: 12ch !important;
}

#san-catalog.sanate-page .sanate-section-head p {
  color: var(--san-muted) !important;
  margin: 0 auto !important;
  max-width: 48rem !important;
}

#san-catalog.sanate-page .sanate-product-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  max-width: 1360px !important;
}

#san-catalog.sanate-page .sanate-product-card {
  border-color: rgba(16, 36, 23, .12) !important;
  border-radius: 18px !important;
  min-height: 100% !important;
  overflow: hidden !important;
  transform: translateY(0) !important;
}

#san-catalog.sanate-page .sanate-product-card::before {
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--acc) 28%, transparent), transparent 44%),
    radial-gradient(circle at 78% 12%, color-mix(in srgb, var(--acc) 18%, transparent), transparent 30%) !important;
  opacity: .55 !important;
}

#san-catalog.sanate-page .sanate-product-card .san-img-wrap {
  aspect-ratio: 4 / 5 !important;
  background: var(--light) !important;
  max-height: none !important;
}

#san-catalog.sanate-page .sanate-product-card .san-img-wrap img {
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

#san-catalog.sanate-page .sanate-brand {
  color: var(--acc) !important;
  display: block;
  font-size: .72rem;
  font-weight: 1000;
  letter-spacing: .12em;
  margin-bottom: .44rem;
}

#san-catalog.sanate-page .sanate-product-card .san-name {
  font-size: clamp(2rem, 2.8vw, 2.75rem) !important;
  line-height: .92 !important;
}

#san-catalog.sanate-page .sanate-product-card .san-tag {
  background: color-mix(in srgb, var(--acc) 11%, #fffdf8) !important;
  border: 1px solid color-mix(in srgb, var(--acc) 26%, transparent) !important;
  color: #102417 !important;
}

#san-catalog.sanate-page .sanate-product-card .san-cta {
  background: var(--acc) !important;
  white-space: nowrap !important;
}

#san-catalog.sanate-page .sanate-product-card:hover {
  border-color: color-mix(in srgb, var(--acc) 42%, transparent) !important;
  transform: translateY(-5px) !important;
}

#san-catalog.sanate-page .sanate-ritual-feature {
  align-items: center;
  display: grid;
  gap: clamp(1.4rem, 4vw, 4rem);
  grid-template-columns: minmax(280px, .82fr) minmax(0, 1fr);
  margin: 0 auto;
  max-width: 1240px;
  padding: clamp(3.5rem, 7vw, 6.2rem) clamp(1rem, 4vw, 3rem);
}

#san-catalog.sanate-page .sanate-ritual-media {
  aspect-ratio: 4 / 3;
  border-radius: 20px;
  box-shadow: 0 28px 80px rgba(6, 47, 29, .16);
  overflow: hidden;
  position: relative;
}

#san-catalog.sanate-page .sanate-ritual-media::after {
  background: linear-gradient(180deg, transparent, rgba(6, 47, 29, .18));
  content: "";
  inset: 0;
  position: absolute;
}

#san-catalog.sanate-page .sanate-ritual-media img,
#san-catalog.sanate-page .sanate-photo-story img {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

#san-catalog.sanate-page .sanate-ritual-copy h2,
#san-catalog.sanate-page .sanate-final-cta h2 {
  color: var(--san-ink) !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.6rem, 5vw, 4.8rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: .96 !important;
  margin: 0 !important;
  max-width: 12ch !important;
}

#san-catalog.sanate-page .sanate-proof-row {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: 1.4rem;
}

#san-catalog.sanate-page .sanate-proof-row span {
  background: #fffdf8;
  border: 1px solid rgba(16, 36, 23, .1);
  border-radius: 999px;
  color: var(--san-ink);
  font-size: .78rem;
  font-weight: 900;
  padding: .65rem .9rem;
}

#san-catalog.sanate-page .sanate-process {
  background:
    radial-gradient(circle at 12% 16%, rgba(217, 201, 79, .14), transparent 28%),
    #07331f;
  color: #fffdf8;
  padding: clamp(3.8rem, 7vw, 6.6rem) clamp(1rem, 4vw, 3rem);
}

#san-catalog.sanate-page .sanate-process .sanate-section-head h2,
#san-catalog.sanate-page .sanate-process .sanate-section-head p {
  color: #fffdf8 !important;
}

#san-catalog.sanate-page .sanate-process-grid {
  display: grid;
  gap: clamp(1rem, 2vw, 1.35rem);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0 auto;
  max-width: 1160px;
}

#san-catalog.sanate-page .sanate-process-grid article {
  background: rgba(255, 253, 248, .08);
  border: 1px solid rgba(255, 253, 248, .16);
  border-radius: 18px;
  min-height: 220px;
  padding: clamp(1.25rem, 2.5vw, 1.8rem);
}

#san-catalog.sanate-page .sanate-process-grid span {
  color: #e7dc67;
  display: block;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .08em;
  margin-bottom: 1rem;
}

#san-catalog.sanate-page .sanate-process-grid strong {
  color: #fffdf8;
  display: block;
  font-size: 1.15rem;
  font-weight: 900;
  line-height: 1.2;
}

#san-catalog.sanate-page .sanate-process-grid p {
  color: #dce8d8 !important;
}

#san-catalog.sanate-page .sanate-photo-story {
  display: grid;
  gap: clamp(.85rem, 2vw, 1.35rem);
  grid-template-columns: 1.1fr .8fr 1.1fr;
  padding: clamp(1rem, 3vw, 2.2rem);
}

#san-catalog.sanate-page .sanate-photo-story figure {
  aspect-ratio: 4 / 5;
  border-radius: 18px;
  margin: 0;
  overflow: hidden;
  position: relative;
}

#san-catalog.sanate-page .sanate-photo-story figure:nth-child(2) {
  aspect-ratio: 4 / 5.8;
  margin-top: clamp(1.4rem, 5vw, 4.2rem);
}

#san-catalog.sanate-page .sanate-photo-story figcaption {
  background: linear-gradient(180deg, transparent, rgba(3, 22, 13, .76));
  bottom: 0;
  color: #fffdf8;
  font-size: .86rem;
  font-weight: 800;
  left: 0;
  line-height: 1.35;
  padding: 4rem 1rem 1rem;
  position: absolute;
  right: 0;
}

#san-catalog.sanate-page .sanate-final-cta {
  background:
    radial-gradient(circle at 78% 12%, rgba(217, 201, 79, .16), transparent 28%),
    #fffdf8 !important;
}

#san-catalog.sanate-page .sanate-final-cta .san-cta-wa {
  margin-top: 1.4rem !important;
}

@keyframes sanateFloat {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(-1.1rem, .7rem, 0) scale(1.04); }
}

@media (prefers-reduced-motion: no-preference) {
  #san-catalog.sanate-page .sanate-product-card,
  #san-catalog.sanate-page .sanate-ritual-feature,
  #san-catalog.sanate-page .sanate-process-grid article,
  #san-catalog.sanate-page .sanate-photo-story figure {
    animation: sanateRise .7s ease both;
  }

  #san-catalog.sanate-page .sanate-product-card:nth-child(2),
  #san-catalog.sanate-page .sanate-process-grid article:nth-child(2),
  #san-catalog.sanate-page .sanate-photo-story figure:nth-child(2) {
    animation-delay: .08s;
  }

  #san-catalog.sanate-page .sanate-product-card:nth-child(3),
  #san-catalog.sanate-page .sanate-process-grid article:nth-child(3),
  #san-catalog.sanate-page .sanate-photo-story figure:nth-child(3) {
    animation-delay: .14s;
  }
}

@keyframes sanateRise {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1180px) {
  #san-catalog.sanate-page .sanate-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 900px) {
  #san-catalog.sanate-page .sanate-hero {
    min-height: 760px !important;
  }

  #san-catalog.sanate-page .sanate-hero-product {
    transform: none;
  }

  #san-catalog.sanate-page .sanate-ritual-feature,
  #san-catalog.sanate-page .sanate-process-grid,
  #san-catalog.sanate-page .sanate-photo-story {
    grid-template-columns: 1fr;
  }

  #san-catalog.sanate-page .sanate-photo-story figure,
  #san-catalog.sanate-page .sanate-photo-story figure:nth-child(2) {
    aspect-ratio: 16 / 11;
    margin-top: 0;
  }
}

@media (max-width: 620px) {
  #san-catalog.sanate-page .sanate-hero {
    min-height: 720px !important;
    padding: 2.25rem 1rem 1rem !important;
  }

  #san-catalog.sanate-page .san-hero-main {
    font-size: clamp(3.05rem, 14vw, 4rem) !important;
    max-width: 9ch !important;
  }

  #san-catalog.sanate-page .sanate-hero-product {
    width: min(250px, 78vw) !important;
  }

  #san-catalog.sanate-page .sanate-scent-strip {
    justify-content: flex-start;
    overflow-x: auto;
    padding: .85rem 1rem;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  #san-catalog.sanate-page .sanate-scent-strip span {
    flex: 0 0 auto;
    scroll-snap-align: start;
  }

  #san-catalog.sanate-page .sanate-product-grid {
    grid-template-columns: 1fr !important;
  }

  #san-catalog.sanate-page .sanate-products,
  #san-catalog.sanate-page .sanate-ritual-feature,
  #san-catalog.sanate-page .sanate-process,
  #san-catalog.sanate-page .sanate-photo-story {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  #san-catalog.sanate-page .sanate-product-card .san-img-wrap {
    aspect-ratio: 5 / 4 !important;
  }

  #san-catalog.sanate-page .sanate-product-card .san-footer {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  #san-catalog.sanate-page .sanate-product-card .san-cta {
    justify-content: center !important;
    width: 100% !important;
  }
}

#bb-clean-product .sanate-product-detail {
  background:
    radial-gradient(circle at 12% 10%, rgba(217, 201, 79, .12), transparent 26%),
    radial-gradient(circle at 86% 34%, rgba(11, 111, 60, .08), transparent 28%),
    #fbf8f1 !important;
  color: #102417 !important;
  padding: clamp(2.5rem, 6vw, 5rem) clamp(1rem, 4vw, 3rem) !important;
}

#bb-clean-product .sanate-product-hero {
  align-items: center;
  display: grid;
  gap: clamp(1.5rem, 4vw, 4.2rem);
  grid-template-columns: minmax(280px, .78fr) minmax(0, 1fr);
  margin: 0 auto;
  max-width: 1180px;
}

#bb-clean-product .sanate-product-visual {
  background:
    radial-gradient(circle at 50% 16%, color-mix(in srgb, var(--acc) 16%, transparent), transparent 34%),
    #fffdf8;
  border: 1px solid rgba(16, 36, 23, .1);
  border-radius: 22px;
  box-shadow: 0 28px 80px rgba(6, 47, 29, .14);
  margin: 0;
  overflow: hidden;
  padding: clamp(.8rem, 2vw, 1.2rem);
}

#bb-clean-product .sanate-product-visual img {
  aspect-ratio: 4 / 5;
  border-radius: 16px;
  display: block;
  height: auto;
  object-fit: cover;
  width: 100%;
}

#bb-clean-product .sanate-product-copy .sanate-brand {
  color: var(--acc) !important;
  display: block;
  font-size: .78rem;
  font-weight: 1000;
  letter-spacing: .12em;
  margin-bottom: .8rem;
  text-transform: uppercase;
}

#bb-clean-product .sanate-product-copy h1 {
  color: #102417 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(3.2rem, 7vw, 6.6rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: .9 !important;
  margin: 0 0 .8rem !important;
}

#bb-clean-product .sanate-product-copy h2 {
  color: #536359 !important;
  font-size: clamp(1.05rem, 1.8vw, 1.35rem) !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  line-height: 1.35 !important;
  margin: 0 0 1rem !important;
}

#bb-clean-product .sanate-product-copy p {
  color: #536359 !important;
  font-size: 1.02rem !important;
  line-height: 1.72 !important;
  max-width: 42rem !important;
}

#bb-clean-product .sanate-product-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
  margin-top: 1.5rem;
}

#bb-clean-product .sanate-product-actions a {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-weight: 900;
  justify-content: center;
  min-height: 48px;
  padding: .9rem 1.25rem;
  text-decoration: none;
}

#bb-clean-product .sanate-product-actions a:first-child {
  background: var(--acc);
  color: #fffdf8 !important;
}

#bb-clean-product .sanate-product-actions a:last-child {
  background: #fffdf8;
  border: 1px solid rgba(16, 36, 23, .12);
  color: #102417 !important;
}

#bb-clean-product .sanate-product-notes {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: clamp(2.2rem, 5vw, 3.8rem) auto 0;
  max-width: 1180px;
}

#bb-clean-product .sanate-product-notes article {
  background: #fffdf8;
  border: 1px solid rgba(16, 36, 23, .1);
  border-radius: 18px;
  padding: clamp(1.15rem, 2.2vw, 1.55rem);
}

#bb-clean-product .sanate-product-notes span {
  color: var(--acc);
  display: block;
  font-size: .76rem;
  font-weight: 1000;
  letter-spacing: .08em;
  margin-bottom: .7rem;
  text-transform: uppercase;
}

#bb-clean-product .sanate-product-notes strong {
  color: #102417;
  display: block;
  font-size: 1.05rem;
  font-weight: 900;
}

#bb-clean-product .sanate-product-notes p {
  color: #536359 !important;
  font-size: .94rem !important;
  line-height: 1.62 !important;
}

@media (max-width: 820px) {
  #bb-clean-product .sanate-product-hero,
  #bb-clean-product .sanate-product-notes {
    grid-template-columns: 1fr;
  }

  #bb-clean-product .sanate-product-actions a {
    width: 100%;
  }
}


/* ════════════════════════════════════════════════════════════════
   INFUSIONES SANATÉ — rediseño editorial 2026
   Hero cinematográfico · 4 mezclas · historia · proceso · CTA
   ════════════════════════════════════════════════════════════════ */
#san-catalog {
  --inf-paper:  #f5f0e7;
  --inf-paper2: #efe8da;
  --inf-ink:    #15251a;
  --inf-forest: #0c2a1a;
  --inf-forest2:#103a24;
  --inf-lime:   #bacd42;
  --inf-smoke:  #4a5648;
  --inf-line:   rgba(21,37,26,.12);
  --inf-disp:   'Cormorant Garamond', Georgia, serif;
  --inf-body:   'DM Sans', system-ui, -apple-system, sans-serif;
  font-family: var(--inf-body);
  color: var(--inf-ink);
  background: var(--inf-paper);
  overflow: hidden;
}
#san-catalog * { box-sizing: border-box; }
#san-catalog img { max-width: 100%; display: block; }

.inf-eyebrow {
  display: inline-block;
  font-size: .72rem; font-weight: 700; letter-spacing: .22em;
  text-transform: uppercase; color: #2f7d4f;
  margin: 0 0 1rem;
}
.inf-eyebrow--light { color: var(--inf-lime); }

/* ── HERO ─────────────────────────────────────────────── */
.inf-hero {
  position: relative; min-height: 90vh;
  display: flex; align-items: flex-end;
  overflow: hidden; color: #fff;
}
.inf-hero-bg {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0;
  transform: scale(1.06); animation: infHeroZoom 18s ease-out forwards;
}
@keyframes infHeroZoom { to { transform: scale(1); } }
.inf-hero-veil {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(to top, rgba(6,22,13,.95) 0%, rgba(6,22,13,.72) 32%, rgba(6,22,13,.42) 62%, rgba(6,22,13,.5) 100%),
    radial-gradient(90% 70% at 20% 95%, rgba(12,42,26,.6), transparent 72%);
}
.inf-hero-inner {
  position: relative; z-index: 2;
  padding: clamp(2.5rem, 7vw, 6rem) clamp(1.5rem, 6vw, 6rem) clamp(3rem, 7vw, 6rem);
  max-width: 880px;
}
.inf-hero-eyebrow {
  display: block; font-size: .74rem; font-weight: 700; letter-spacing: .24em;
  text-transform: uppercase; color: var(--inf-lime); margin-bottom: 1.2rem;
}
.inf-hero-title {
  font-family: var(--inf-disp); font-weight: 300;
  font-size: clamp(3.4rem, 11vw, 8rem); line-height: .9; margin: 0;
  letter-spacing: .01em;
}
.inf-hero-title em {
  display: block; font-style: italic; color: var(--inf-lime);
  font-size: clamp(1.7rem, 4.5vw, 3.6rem); margin-top: .1rem; letter-spacing: .04em;
}
.inf-hero-sub {
  font-size: clamp(.95rem, 2vw, 1.18rem); line-height: 1.7;
  color: rgba(255,255,255,.86); max-width: 560px; margin: 1.6rem 0 1.8rem;
}
.inf-hero-pills { display: flex; flex-wrap: wrap; gap: .5rem; }
.inf-hero-pills span {
  font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: #fff; background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.28);
  padding: .4rem .9rem; border-radius: 100px; backdrop-filter: blur(4px);
}
.inf-hero-cue {
  display: inline-flex; align-items: center; gap: .55rem; margin-top: 2rem;
  color: #fff; text-decoration: none; font-size: .8rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
}
.inf-hero-cue svg { width: 22px; height: 22px; animation: infBounce 1.8s infinite; }
@keyframes infBounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(5px)} }

/* ── MANIFIESTO ───────────────────────────────────────── */
.inf-manif {
  display: grid; grid-template-columns: 1fr 1fr; align-items: center;
  gap: clamp(1.5rem, 5vw, 5rem);
  padding: clamp(3.5rem, 9vw, 7rem) clamp(1.5rem, 6vw, 6rem);
  background: var(--inf-paper);
}
.inf-manif-img { position: relative; }
.inf-manif-img img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: 18px; box-shadow: 0 30px 70px rgba(12,42,26,.22);
}
.inf-manif-h {
  font-family: var(--inf-disp); font-weight: 400;
  font-size: clamp(1.9rem, 4.5vw, 3.2rem); line-height: 1.08; margin: 0 0 1.2rem;
  color: var(--inf-forest);
}
.inf-manif-copy p { font-size: 1.05rem; line-height: 1.8; color: var(--inf-smoke); margin: 0 0 1.6rem; }
.inf-manif-sign {
  font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: #2f7d4f; padding-top: 1.2rem; border-top: 1px solid var(--inf-line);
}

/* ── SECTION HEADERS ──────────────────────────────────── */
.inf-sec-head { text-align: center; max-width: 680px; margin: 0 auto clamp(2.5rem,6vw,4rem); }
.inf-sec-title {
  font-family: var(--inf-disp); font-weight: 400;
  font-size: clamp(2.1rem, 5.5vw, 3.6rem); line-height: 1.05; margin: 0 0 1rem;
  color: var(--inf-forest);
}
.inf-sec-sub { font-size: 1.02rem; line-height: 1.7; color: var(--inf-smoke); margin: 0; }

/* ── COLECCIÓN (4 productos) ──────────────────────────── */
.inf-coleccion {
  padding: clamp(3.5rem, 9vw, 7rem) clamp(1.25rem, 5vw, 5rem);
  background: linear-gradient(180deg, var(--inf-paper) 0%, var(--inf-paper2) 100%);
}
.inf-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: clamp(1.25rem, 3vw, 2.2rem); max-width: 1080px; margin: 0 auto;
}
.inf-card {
  background: #fff; border-radius: 20px; overflow: hidden;
  box-shadow: 0 10px 30px rgba(12,42,26,.08);
  border: 1px solid rgba(21,37,26,.06);
  display: flex; flex-direction: column;
  transition: transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s cubic-bezier(.2,.7,.2,1);
}
.inf-card:hover { transform: translateY(-8px); box-shadow: 0 28px 60px rgba(12,42,26,.2); }
.inf-card-photo {
  position: relative; overflow: hidden; cursor: zoom-in;
  aspect-ratio: 4/5; background: var(--lt);
}
.inf-card-photo img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s cubic-bezier(.2,.7,.2,1);
}
.inf-card:hover .inf-card-photo img { transform: scale(1.05); }
.inf-card-lema {
  position: absolute; top: 1rem; left: 1rem; z-index: 2;
  font-size: .66rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  color: #fff; background: color-mix(in srgb, var(--acc) 88%, black 12%);
  padding: .38rem .8rem; border-radius: 100px;
  box-shadow: 0 4px 14px rgba(0,0,0,.18);
}
.inf-card-zoom {
  position: absolute; bottom: 1rem; right: 1rem; z-index: 2;
  width: 34px; height: 34px; display: flex; align-items: center; justify-content: center;
  border-radius: 50%; background: rgba(255,255,255,.85); color: var(--dk);
  font-size: 1.2rem; opacity: 0; transform: scale(.8);
  transition: opacity .3s, transform .3s;
}
.inf-card:hover .inf-card-zoom { opacity: 1; transform: scale(1); }
.inf-card-body { padding: 1.5rem 1.6rem 1.7rem; display: flex; flex-direction: column; flex: 1; }
.inf-card-brand {
  font-size: .64rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--acc); margin-bottom: .5rem;
}
.inf-card-name {
  font-family: var(--inf-disp); font-weight: 500;
  font-size: clamp(1.9rem, 4vw, 2.5rem); line-height: 1; margin: 0 0 .9rem; color: var(--inf-ink);
}
.inf-card-tags { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.inf-card-tags span {
  font-size: .7rem; font-weight: 600; letter-spacing: .02em;
  color: var(--dk); background: var(--lt);
  padding: .3rem .7rem; border-radius: 100px;
}
.inf-card-sens { font-size: .9rem; line-height: 1.65; color: var(--inf-smoke); margin: 0 0 1.4rem; flex: 1; }
.inf-card-foot {
  display: flex; align-items: center; justify-content: space-between; gap: .8rem;
  padding-top: 1.1rem; border-top: 1px solid var(--inf-line);
}
.inf-card-net { font-size: .7rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--inf-smoke); }
.inf-card-wa {
  display: inline-flex; align-items: center; gap: .4rem;
  background: var(--acc); color: #fff; text-decoration: none;
  font-size: .82rem; font-weight: 700; padding: .6rem 1.1rem; border-radius: 100px;
  transition: filter .2s, transform .2s; white-space: nowrap;
}
.inf-card-wa:hover { filter: brightness(.92); transform: translateY(-1px); }
.inf-card-wa svg { width: 16px; height: 16px; }

/* ── HISTORIA (hecho con amor) ────────────────────────── */
.inf-historia {
  display: grid; grid-template-columns: 1fr 1fr; align-items: stretch;
  background: var(--inf-forest); color: #fff;
}
.inf-historia-media { position: relative; min-height: 380px; }
.inf-historia-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.inf-historia-badge {
  position: absolute; top: 1.4rem; left: 1.4rem; z-index: 2;
  font-size: .74rem; font-weight: 800; letter-spacing: .04em;
  color: #fff; background: #c7424d; padding: .5rem 1rem; border-radius: 100px;
  box-shadow: 0 8px 24px rgba(0,0,0,.3);
}
.inf-historia-copy { padding: clamp(2.5rem, 6vw, 5rem); display: flex; flex-direction: column; justify-content: center; }
.inf-historia-h {
  font-family: var(--inf-disp); font-weight: 400;
  font-size: clamp(2rem, 5vw, 3.4rem); line-height: 1.04; margin: 0 0 1.2rem; color: #fff;
}
.inf-historia-copy p { font-size: 1.02rem; line-height: 1.8; color: rgba(255,255,255,.82); margin: 0 0 2rem; max-width: 460px; }
.inf-historia-stats { display: grid; grid-template-columns: repeat(4, auto); gap: clamp(1rem,3vw,2.2rem); }
.inf-historia-stats div { display: flex; flex-direction: column; }
.inf-historia-stats b {
  font-family: var(--inf-disp); font-weight: 500; font-size: clamp(1.8rem,4vw,2.6rem);
  line-height: 1; color: var(--inf-lime);
}
.inf-historia-stats span { font-size: .68rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.6); margin-top: .35rem; }

/* ── PROCESO ──────────────────────────────────────────── */
.inf-proceso { padding: clamp(3.5rem, 9vw, 7rem) clamp(1.5rem, 6vw, 6rem); background: var(--inf-paper); }
.inf-pasos { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.5rem, 4vw, 3rem); max-width: 1080px; margin: 0 auto; }
.inf-paso { position: relative; padding-top: 1.5rem; border-top: 2px solid var(--inf-line); }
.inf-paso-n {
  font-family: var(--inf-disp); font-weight: 400; font-size: clamp(2.4rem,5vw,3.4rem);
  color: var(--inf-lime); line-height: 1; display: block; margin-bottom: .8rem;
}
.inf-paso h3 { font-family: var(--inf-disp); font-weight: 600; font-size: 1.4rem; margin: 0 0 .7rem; color: var(--inf-forest); }
.inf-paso p { font-size: .92rem; line-height: 1.7; color: var(--inf-smoke); margin: 0; }

/* ── CTA final ────────────────────────────────────────── */
.inf-cta { position: relative; min-height: 56vh; display: flex; align-items: center; justify-content: center; overflow: hidden; text-align: center; color: #fff; }
.inf-cta-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.inf-cta-veil { position: absolute; inset: 0; z-index: 1; background: linear-gradient(135deg, rgba(6,22,13,.82), rgba(12,42,26,.72)); }
.inf-cta-inner { position: relative; z-index: 2; padding: clamp(3rem,8vw,6rem) 1.5rem; max-width: 620px; }
.inf-cta-inner h2 { font-family: var(--inf-disp); font-weight: 400; font-size: clamp(2.2rem,6vw,4rem); line-height: 1.04; margin: 0 0 1rem; }
.inf-cta-inner p { font-size: 1.05rem; line-height: 1.7; color: rgba(255,255,255,.85); margin: 0 0 2rem; }
.inf-cta-wa {
  display: inline-flex; align-items: center; gap: .6rem;
  background: #25d366; color: #062f1d; text-decoration: none;
  font-weight: 700; font-size: 1rem; padding: .95rem 1.8rem; border-radius: 100px;
  box-shadow: 0 14px 40px rgba(37,211,102,.4); transition: transform .2s, box-shadow .2s;
}
.inf-cta-wa:hover { transform: translateY(-2px); box-shadow: 0 20px 52px rgba(37,211,102,.5); }

/* ── LIGHTBOX ─────────────────────────────────────────── */
.inf-lightbox {
  position: fixed; inset: 0; z-index: 100060;
  background: rgba(6,18,11,.92); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center; padding: 4vh 4vw;
  opacity: 0; transition: opacity .26s ease; cursor: zoom-out;
}
.inf-lightbox.open { opacity: 1; }
.inf-lightbox img {
  max-width: 100%; max-height: 92vh; border-radius: 14px;
  box-shadow: 0 30px 90px rgba(0,0,0,.6);
  transform: scale(.94); transition: transform .3s cubic-bezier(.2,.7,.2,1);
}
.inf-lightbox.open img { transform: scale(1); }
.inf-lb-x {
  position: fixed; top: 1.2rem; right: 1.4rem; z-index: 2;
  width: 46px; height: 46px; border-radius: 50%; border: none; cursor: pointer;
  background: rgba(255,255,255,.16); color: #fff; font-size: 1.7rem; line-height: 1;
}

/* ── RESPONSIVE ───────────────────────────────────────── */
@media (max-width: 900px) {
  .inf-manif { grid-template-columns: 1fr; }
  .inf-manif-img img { aspect-ratio: 16/10; }
  .inf-historia { grid-template-columns: 1fr; }
  .inf-historia-media { min-height: 280px; }
  .inf-pasos { grid-template-columns: 1fr; gap: 1.6rem; }
  .inf-paso { padding-top: 1rem; }
}
@media (max-width: 620px) {
  .inf-hero { min-height: 86vh; }
  .inf-grid { grid-template-columns: 1fr; max-width: 420px; }
  .inf-historia-stats { grid-template-columns: repeat(2, 1fr); gap: 1.2rem 1rem; }
  .inf-card-foot { flex-direction: column; align-items: flex-start; gap: .7rem; }
  .inf-card-wa { width: 100%; justify-content: center; }
}

/* ════════════════════════════════════════════════════════
   Páginas de categoría: ocultar secciones server-rendered
   hermanas que no son el catálogo inyectado (evita leftover).
   Independiente del timing (CSS), preserva la rama del catálogo.
   ════════════════════════════════════════════════════════ */
html.bb-route-infusiones:not(.bb-route-product) main > section:not(:has(#san-catalog)):not(#san-catalog),
html.bb-route-infusiones:not(.bb-route-product) main > div:not(:has(#san-catalog)) {
  display: none !important;
}

/* ════════════════════════════════════════════════════════
   OVERRIDE FUERTE — el CSS viejo tiene "#san-catalog p {color/
   font-size/line-height !important}" que rompe mi diseño nuevo.
   Estas reglas (.inf-*, mayor especificidad + !important) ganan.
   ════════════════════════════════════════════════════════ */
#san-catalog .inf-eyebrow { color: #2f7d4f !important; }
#san-catalog .inf-eyebrow--light { color: var(--inf-lime) !important; }
#san-catalog .inf-hero-eyebrow { color: var(--inf-lime) !important; }
#san-catalog .inf-hero-title,
#san-catalog .inf-hero-title em { color: #fff !important; }
#san-catalog .inf-hero-title em { color: var(--inf-lime) !important; }
#san-catalog .inf-hero-sub { color: rgba(255,255,255,.92) !important; font-size: clamp(.98rem,2vw,1.2rem) !important; line-height: 1.7 !important; }
#san-catalog .inf-hero-pills span { color: #fff !important; }
#san-catalog .inf-hero-cue { color: #fff !important; }
#san-catalog .inf-manif-h { color: var(--inf-forest) !important; }
#san-catalog .inf-manif-copy p { color: var(--inf-smoke) !important; font-size: 1.06rem !important; line-height: 1.8 !important; }
#san-catalog .inf-manif-sign { color: #2f7d4f !important; }
#san-catalog .inf-sec-title { color: var(--inf-forest) !important; }
#san-catalog .inf-sec-sub { color: var(--inf-smoke) !important; font-size: 1.04rem !important; line-height: 1.7 !important; }
#san-catalog .inf-card-brand { color: var(--acc) !important; }
#san-catalog .inf-card-name { color: var(--inf-ink) !important; }
#san-catalog .inf-card-tags span { color: var(--dk) !important; }
#san-catalog .inf-card-sens { color: var(--inf-smoke) !important; font-size: .92rem !important; line-height: 1.65 !important; }
#san-catalog .inf-card-net { color: var(--inf-smoke) !important; }
#san-catalog .inf-card-wa { color: #fff !important; }
#san-catalog .inf-card-lema { color: #fff !important; }
#san-catalog .inf-historia-h { color: #fff !important; }
#san-catalog .inf-historia-copy p { color: rgba(255,255,255,.88) !important; font-size: 1.04rem !important; line-height: 1.8 !important; }
#san-catalog .inf-historia-stats b { color: var(--inf-lime) !important; }
#san-catalog .inf-historia-stats span { color: rgba(255,255,255,.65) !important; }
#san-catalog .inf-paso-n { color: var(--inf-lime) !important; }
#san-catalog .inf-paso h3 { color: var(--inf-forest) !important; }
#san-catalog .inf-paso p { color: var(--inf-smoke) !important; font-size: .94rem !important; line-height: 1.7 !important; }
#san-catalog .inf-cta-inner h2 { color: #fff !important; }
#san-catalog .inf-cta-inner p { color: rgba(255,255,255,.92) !important; font-size: 1.06rem !important; line-height: 1.7 !important; }

/* ==========================================================================
   INFUSIONES SANATE - capa final de venta, legibilidad y responsive
   ========================================================================== */
html.bb-route-infusiones,
html.bb-route-infusiones body {
  background: #f6f0e6 !important;
}

#san-catalog {
  --inf-paper: #f6f0e6;
  --inf-paper2: #fffaf1;
  --inf-ink: #102417;
  --inf-forest: #082719;
  --inf-forest2: #123f28;
  --inf-lime: #c9dc43;
  --inf-gold: #e3a824;
  --inf-clay: #b75b37;
  --inf-smoke: #526156;
  --inf-line: rgba(16, 36, 23, .14);
  background: var(--inf-paper) !important;
  color: var(--inf-ink) !important;
}

#san-catalog .inf-hero {
  min-height: min(820px, calc(100vh - 20px)) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.03fr) minmax(320px, .72fr);
  align-items: center !important;
  gap: clamp(1.4rem, 4vw, 4.5rem);
  padding: clamp(2.4rem, 6vw, 5.8rem);
  color: #fff !important;
}

#san-catalog .inf-hero-bg {
  filter: saturate(1.05) contrast(1.04);
  object-position: center center;
}

#san-catalog .inf-hero-veil {
  background:
    linear-gradient(90deg, rgba(4, 20, 12, .94) 0%, rgba(8, 39, 25, .82) 45%, rgba(8, 39, 25, .36) 100%),
    linear-gradient(0deg, rgba(4, 20, 12, .66), rgba(4, 20, 12, .12)) !important;
}

#san-catalog .inf-hero-inner {
  padding: 0 !important;
  max-width: 760px !important;
}

#san-catalog .inf-hero-title {
  max-width: 780px;
  font-size: clamp(3rem, 7vw, 6.8rem) !important;
  line-height: .9 !important;
  letter-spacing: 0 !important;
}

#san-catalog .inf-hero-title em {
  max-width: 650px;
  margin-top: .55rem !important;
  color: #f4e9bb !important;
  font-size: clamp(1.25rem, 2.6vw, 2.5rem) !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

#san-catalog .inf-hero-sub {
  max-width: 610px !important;
  margin: 1.35rem 0 1.5rem !important;
  color: rgba(255, 255, 255, .92) !important;
}

#san-catalog .inf-hero-actions,
#san-catalog .inf-card-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .72rem;
}

#san-catalog .inf-primary,
#san-catalog .inf-secondary,
#san-catalog .inf-card-detail,
#san-catalog .inf-card-wa,
#san-catalog .inf-cta-wa {
  min-height: 44px;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  text-decoration: none !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

#san-catalog .inf-primary {
  background: #f4e9bb !important;
  color: #082719 !important;
  padding: .92rem 1.25rem;
}

#san-catalog .inf-secondary {
  border: 1px solid rgba(255, 255, 255, .42);
  color: #fff !important;
  padding: .88rem 1.15rem;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  background: rgba(255, 255, 255, .08);
}

#san-catalog .inf-hero-pills {
  margin-top: 1.2rem;
}

#san-catalog .inf-hero-pills span {
  border-radius: 8px !important;
  background: rgba(255, 255, 255, .1) !important;
}

#san-catalog .inf-hero-pack {
  position: relative;
  z-index: 2;
  margin: 0;
  align-self: end;
}

#san-catalog .inf-hero-pack img {
  width: min(420px, 100%);
  margin-left: auto;
  border-radius: 8px;
  box-shadow: 0 32px 80px rgba(0, 0, 0, .36);
}

#san-catalog .inf-hero-pack figcaption {
  margin-top: .8rem;
  color: rgba(255, 255, 255, .82);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-align: right;
  text-transform: uppercase;
}

#san-catalog .inf-proofbar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-bottom: 1px solid var(--inf-line);
  background: #fffaf1;
}

#san-catalog .inf-proofbar div {
  min-width: 0;
  padding: clamp(1rem, 2.4vw, 1.65rem);
  border-right: 1px solid var(--inf-line);
}

#san-catalog .inf-proofbar div:last-child {
  border-right: 0;
}

#san-catalog .inf-proofbar b {
  color: var(--inf-forest);
  display: block;
  font-family: var(--inf-disp);
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 600;
  line-height: .9;
}

#san-catalog .inf-proofbar span {
  color: var(--inf-smoke);
  display: block;
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .08em;
  margin-top: .5rem;
  text-transform: uppercase;
}

#san-catalog .inf-manif,
#san-catalog .inf-coleccion,
#san-catalog .inf-proceso {
  padding-left: clamp(1.15rem, 5vw, 5rem) !important;
  padding-right: clamp(1.15rem, 5vw, 5rem) !important;
}

#san-catalog .inf-manif-img img {
  border-radius: 8px !important;
}

#san-catalog .inf-grid {
  max-width: 1180px !important;
}

#san-catalog .inf-card {
  border-radius: 8px !important;
  border: 1px solid rgba(16, 36, 23, .1) !important;
  box-shadow: 0 16px 34px rgba(16, 36, 23, .1) !important;
}

#san-catalog .inf-card-photo {
  aspect-ratio: 16 / 13 !important;
  background: var(--lt) !important;
}

#san-catalog .inf-card-photo img {
  object-fit: contain !important;
  padding: clamp(.8rem, 2vw, 1.35rem);
}

#san-catalog .inf-card-lema,
#san-catalog .inf-historia-badge {
  border-radius: 8px !important;
}

#san-catalog .inf-card-body {
  padding: clamp(1.05rem, 2.6vw, 1.65rem) !important;
}

#san-catalog .inf-card-foot {
  align-items: flex-end !important;
}

#san-catalog .inf-card-actions {
  justify-content: flex-end;
}

#san-catalog .inf-card-detail {
  border: 1px solid var(--inf-line);
  color: var(--dk) !important;
  padding: .72rem .95rem;
}

#san-catalog .inf-card-wa {
  padding: .72rem 1rem !important;
}

#san-catalog .inf-historia {
  min-height: 560px;
}

#san-catalog .inf-historia-media img {
  object-position: center center;
}

#san-catalog .inf-historia-copy {
  background:
    linear-gradient(135deg, rgba(8, 39, 25, .98), rgba(18, 63, 40, .94)),
    #082719 !important;
}

#san-catalog .inf-historia-h {
  max-width: 560px;
}

#san-catalog .inf-historia-stats {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

#san-catalog .inf-paso {
  border-top-color: rgba(16, 36, 23, .18) !important;
}

#san-catalog .inf-cta {
  min-height: 520px !important;
}

#san-catalog .inf-cta-veil {
  background:
    linear-gradient(90deg, rgba(4, 20, 12, .9), rgba(8, 39, 25, .62)),
    linear-gradient(0deg, rgba(4, 20, 12, .78), rgba(4, 20, 12, .22)) !important;
}

#san-catalog .inf-cta-inner {
  max-width: 760px !important;
}

#san-catalog .inf-cta-wa {
  border-radius: 8px !important;
}

@media (max-width: 980px) {
  #san-catalog .inf-hero {
    grid-template-columns: 1fr;
    min-height: auto !important;
    padding-top: clamp(3rem, 10vw, 5rem);
  }

  #san-catalog .inf-hero-pack {
    justify-self: start;
    width: min(520px, 100%);
  }

  #san-catalog .inf-hero-pack img {
    margin-left: 0;
  }

  #san-catalog .inf-hero-pack figcaption {
    text-align: left;
  }

  #san-catalog .inf-proofbar {
    grid-template-columns: repeat(2, 1fr);
  }

  #san-catalog .inf-proofbar div:nth-child(2) {
    border-right: 0;
  }

  #san-catalog .inf-proofbar div:nth-child(-n+2) {
    border-bottom: 1px solid var(--inf-line);
  }
}

@media (max-width: 680px) {
  #san-catalog .inf-hero {
    padding: 2.25rem 1.05rem 1.35rem;
    gap: 1.3rem;
  }

  #san-catalog .inf-hero-veil {
    background:
      linear-gradient(0deg, rgba(4, 20, 12, .96), rgba(8, 39, 25, .66)),
      linear-gradient(90deg, rgba(4, 20, 12, .82), rgba(8, 39, 25, .22)) !important;
  }

  #san-catalog .inf-hero-title {
    font-size: clamp(2.55rem, 13vw, 4.1rem) !important;
  }

  #san-catalog .inf-hero-title em {
    font-size: clamp(1.1rem, 6vw, 1.55rem) !important;
  }

  #san-catalog .inf-hero-actions,
  #san-catalog .inf-card-actions {
    width: 100%;
  }

  #san-catalog .inf-primary,
  #san-catalog .inf-secondary,
  #san-catalog .inf-card-detail,
  #san-catalog .inf-card-wa,
  #san-catalog .inf-cta-wa {
    width: 100%;
  }

  #san-catalog .inf-hero-pack img {
    width: 100%;
  }

  #san-catalog .inf-proofbar {
    grid-template-columns: 1fr 1fr;
  }

  #san-catalog .inf-grid {
    max-width: 440px !important;
  }

  #san-catalog .inf-card-photo {
    aspect-ratio: 1 / 1 !important;
  }

  #san-catalog .inf-card-foot {
    align-items: flex-start !important;
  }

  #san-catalog .inf-historia-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #san-catalog .inf-historia-media {
    min-height: 360px !important;
  }
}

/* Infusiones: estabilidad de layout y navegacion por teclado. */
html.bb-route-infusiones,
html.bb-route-infusiones body,
html.bb-route-infusiones main,
html.bb-route-infusiones #wrapper,
html.bb-route-infusiones #content-wrapper,
html.bb-route-infusiones #content {
  max-width: 100%;
  overflow-x: clip;
}

#san-catalog a:focus-visible,
#san-catalog button:focus-visible {
  outline: 3px solid #f4e9bb;
  outline-offset: 3px;
}

#san-catalog .inf-primary:hover,
#san-catalog .inf-secondary:hover,
#san-catalog .inf-card-detail:hover {
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
  #san-catalog *,
  #san-catalog *::before,
  #san-catalog *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

@media (max-width: 420px) {
  #san-catalog .inf-hero {
    padding-left: .85rem;
    padding-right: .85rem;
  }

  #san-catalog .inf-proofbar span {
    font-size: .66rem;
    letter-spacing: .04em;
  }

  #san-catalog .inf-card-body {
    padding: 1rem !important;
  }

  #san-catalog .inf-hero-pills span {
    flex: 1 1 calc(50% - .25rem);
    text-align: center;
  }
}

@media (max-width: 680px) {
  html.bb-route-infusiones body,
  html.bb-route-infusiones main,
  html.bb-route-infusiones #wrapper,
  html.bb-route-infusiones #wrapper > .container,
  html.bb-route-infusiones #wrapper .row,
  html.bb-route-infusiones #content-wrapper,
  html.bb-route-infusiones #content,
  html.bb-route-infusiones #san-catalog,
  html.bb-route-infusiones #bb-clean-product {
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  #san-catalog .inf-hero,
  #san-catalog .inf-hero-inner,
  #san-catalog .inf-hero-pack,
  #san-catalog .inf-hero-actions,
  #san-catalog .inf-hero-pills,
  #san-catalog .inf-proofbar,
  #san-catalog .inf-manif,
  #san-catalog .inf-grid,
  #san-catalog .inf-card,
  #san-catalog .inf-historia,
  #san-catalog .inf-proceso,
  #san-catalog .inf-cta,
  #bb-clean-product .sanate-product-hero,
  #bb-clean-product .sanate-product-visual,
  #bb-clean-product .sanate-product-copy,
  #bb-clean-product .sanate-product-notes {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  #san-catalog .inf-hero-sub,
  #san-catalog .inf-card-sens,
  #san-catalog .inf-sec-sub,
  #san-catalog .inf-manif-copy p,
  #san-catalog .inf-historia-copy p,
  #san-catalog .inf-paso p,
  #san-catalog .inf-cta-inner p,
  #bb-clean-product .sanate-product-copy p {
    overflow-wrap: anywhere;
    white-space: normal !important;
  }

  #san-catalog .inf-hero-pills span {
    flex: 0 1 auto;
  }

  #san-catalog .inf-primary,
  #san-catalog .inf-secondary,
  #san-catalog .inf-card-detail,
  #san-catalog .inf-card-wa,
  #san-catalog .inf-cta-wa {
    box-sizing: border-box !important;
    max-width: 100% !important;
    white-space: normal !important;
  }
}

#bb-mnav-trigger {
  display: none;
}

@media (max-width: 1024px) {
  html.bb-mnav-fallback body #header .ybc-menu-toggle {
    display: none !important;
  }

  html body #header .elementor-widget-search,
  html body #header [data-widget_type*="search"],
  html body #header #search_widget,
  html body #header .search-widget {
    display: none !important;
  }

  #bb-mnav-trigger {
    align-items: center;
    background: #fffaf1;
    border: 1px solid rgba(16, 36, 23, .18);
    border-radius: 50%;
    box-shadow: 0 6px 20px rgba(16, 36, 23, .14);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    height: 42px;
    justify-content: center;
    padding: 0;
    position: fixed;
    right: 14px;
    top: 13px;
    width: 42px;
    z-index: 10020;
  }

  #bb-mnav-trigger span {
    background: #102417;
    border-radius: 2px;
    display: block;
    height: 2px;
    margin: 2.5px 0;
    width: 20px;
  }
}

@media (max-width: 420px) {
  #san-catalog .inf-hero-pills span {
    flex: 1 1 calc(50% - .25rem) !important;
    text-align: center;
  }
}

/* ════════════════════════════════════════════════════════════════
   INFUSIONES SANATÉ — FICHA DE PRODUCTO INDIVIDUAL (ipd-*)
   Diseño editorial split: foto + info, ingredientes, ritual,
   historia, otros productos y CTA final.
   ════════════════════════════════════════════════════════════════ */

/* ── Variables heredadas ─────────────────────────────────────── */
.ipd {
  --ipd-paper:   #f6f0e6;
  --ipd-paper2:  #fffaf1;
  --ipd-ink:     #102417;
  --ipd-forest:  #082719;
  --ipd-lime:    #c9dc43;
  --ipd-smoke:   #526156;
  --ipd-line:    rgba(16,36,23,.12);
  --ipd-disp:    'Cormorant Garamond', Georgia, serif;
  --ipd-body:    'DM Sans', system-ui, -apple-system, sans-serif;
  font-family: var(--ipd-body);
  color: var(--ipd-ink);
  background: var(--ipd-paper);
}
.ipd *, .ipd *::before, .ipd *::after { box-sizing: border-box; }
.ipd img { max-width: 100%; display: block; }

/* ── Breadcrumb ──────────────────────────────────────────────── */
.ipd-crumb {
  padding: 1.15rem clamp(1.15rem,5vw,5rem);
  font-size: .78rem; font-weight: 700; letter-spacing: .04em;
  color: var(--ipd-smoke);
  border-bottom: 1px solid var(--ipd-line);
  background: var(--ipd-paper2);
}
.ipd-crumb a {
  color: var(--acc); text-decoration: none;
  transition: color .2s;
}
.ipd-crumb a:hover { color: var(--dk); text-decoration: underline; }
.ipd-crumb span { margin: 0 .45rem; opacity: .4; }
.ipd-crumb b { color: var(--ipd-ink); font-weight: 700; }

/* ── Hero split: foto + info ─────────────────────────────────── */
.ipd-hero {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(340px, 1.1fr);
  gap: clamp(2rem, 5vw, 5rem);
  padding: clamp(2.5rem,6vw,5rem) clamp(1.15rem,5vw,5rem);
  align-items: start;
  background: var(--ipd-paper);
}

.ipd-hero-photo {
  position: relative;
  background: var(--lt);
  border-radius: 12px;
  overflow: hidden;
  cursor: zoom-in;
  aspect-ratio: 1 / 1;
}
.ipd-hero-photo img {
  width: 100%; height: 100%;
  object-fit: contain;
  padding: clamp(1rem,3vw,2.5rem);
  transition: transform .5s cubic-bezier(.2,.7,.2,1);
}
.ipd-hero-photo:hover img { transform: scale(1.06); }

.ipd-hero-zoom {
  position: absolute; bottom: 1rem; right: 1rem;
  width: 38px; height: 38px; display: flex;
  align-items: center; justify-content: center;
  border-radius: 50%;
  background: rgba(255,255,255,.9); color: var(--dk);
  font-size: 1.3rem; opacity: 0; transform: scale(.85);
  transition: opacity .25s, transform .25s;
  box-shadow: 0 4px 16px rgba(0,0,0,.12);
}
.ipd-hero-photo:hover .ipd-hero-zoom { opacity: 1; transform: scale(1); }

.ipd-hero-info {
  padding-top: .8rem;
  display: flex; flex-direction: column; gap: 0;
}

.ipd-brand {
  display: block;
  font-size: .68rem; font-weight: 800; letter-spacing: .16em;
  text-transform: uppercase; color: var(--acc);
  margin-bottom: .8rem;
}

.ipd-name {
  font-family: var(--ipd-disp); font-weight: 400;
  font-size: clamp(3rem, 7vw, 5rem); line-height: .88;
  color: var(--ipd-forest); margin: 0 0 .6rem;
}

.ipd-lema {
  font-family: var(--ipd-disp); font-style: italic; font-weight: 400;
  font-size: clamp(1.1rem, 2.5vw, 1.55rem); line-height: 1.2;
  color: var(--acc); margin: 0 0 1.2rem;
}

.ipd-pills {
  display: flex; flex-wrap: wrap; gap: .4rem;
  margin-bottom: 1.3rem;
}
.ipd-pills span {
  font-size: .72rem; font-weight: 700; letter-spacing: .04em;
  color: var(--dk); background: var(--lt);
  padding: .38rem .75rem; border-radius: 8px;
}

.ipd-sens {
  font-size: 1.02rem; line-height: 1.75;
  color: var(--ipd-smoke); margin: 0 0 1.5rem;
  max-width: 480px;
}

.ipd-meta {
  display: flex; flex-wrap: wrap; gap: .5rem;
  margin-bottom: 1.6rem;
}
.ipd-meta span {
  font-size: .68rem; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: var(--ipd-smoke);
  background: rgba(16,36,23,.06);
  padding: .4rem .75rem; border-radius: 8px;
  border: 1px solid var(--ipd-line);
}

.ipd-buy {
  display: inline-flex; align-items: center; gap: .6rem;
  background: var(--acc); color: #fff !important;
  text-decoration: none !important; font-weight: 900;
  font-size: 1rem; padding: .95rem 1.6rem;
  border-radius: 8px; min-height: 48px;
  box-shadow: 0 10px 30px color-mix(in srgb, var(--acc) 45%, transparent);
  transition: transform .2s, box-shadow .2s, filter .2s;
}
.ipd-buy:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 40px color-mix(in srgb, var(--acc) 55%, transparent);
  filter: brightness(.92);
}
.ipd-buy svg { flex-shrink: 0; }

.ipd-seal {
  display: block; margin-top: 1.3rem;
  font-size: .72rem; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: var(--ipd-smoke);
  padding-top: 1.1rem; border-top: 1px solid var(--ipd-line);
}

/* ── Sección ingredientes (ipd-bot) ──────────────────────────── */
.ipd-bot {
  padding: clamp(3rem,8vw,6rem) clamp(1.15rem,5vw,5rem);
  background: var(--ipd-paper2);
}

.ipd-sec-head {
  text-align: center; max-width: 620px; margin: 0 auto 2.5rem;
}
.ipd-sec-head h2 {
  font-family: var(--ipd-disp); font-weight: 400;
  font-size: clamp(2rem, 5vw, 3.2rem); line-height: 1.06;
  color: var(--ipd-forest); margin: .6rem 0 0;
}

.ipd-plants {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.2rem,3vw,2rem); max-width: 960px; margin: 0 auto;
}
.ipd-plant {
  background: #fff; border-radius: 12px;
  padding: clamp(1.4rem,3vw,2rem);
  border: 1px solid rgba(16,36,23,.07);
  box-shadow: 0 8px 24px rgba(16,36,23,.07);
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s;
}
.ipd-plant:hover {
  transform: translateY(-5px);
  box-shadow: 0 18px 44px rgba(16,36,23,.14);
}
.ipd-plant h4 {
  font-family: var(--ipd-disp); font-weight: 600;
  font-size: 1.35rem; color: var(--ipd-forest); margin: 0 0 .3rem;
}
.ipd-plant-sub {
  display: block; font-size: .68rem; font-weight: 800;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--acc); margin-bottom: .8rem;
}
.ipd-plant p {
  font-size: .9rem; line-height: 1.65; color: var(--ipd-smoke);
  margin: 0;
}

/* ── Sección preparación (ipd-prep) ──────────────────────────── */
.ipd-prep {
  padding: clamp(3.5rem,8vw,6.5rem) clamp(1.15rem,5vw,5rem);
  background: var(--ipd-forest); color: #fff;
}
.ipd-prep .ipd-sec-head h2 { color: #fff; }

.ipd-steps {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: clamp(1rem,2.5vw,1.8rem); max-width: 1020px; margin: 0 auto;
}
.ipd-step {
  display: flex; flex-direction: column; gap: .8rem;
  padding-top: 1.2rem;
  border-top: 2px solid rgba(255,255,255,.14);
}
.ipd-step-n {
  font-family: var(--ipd-disp); font-weight: 400;
  font-size: clamp(2.2rem, 4vw, 3rem);
  color: var(--ipd-lime); line-height: 1;
}
.ipd-step-tx h4 {
  font-family: var(--ipd-disp); font-weight: 600;
  font-size: 1.15rem; color: #fff; margin: 0 0 .5rem;
}
.ipd-step-tx p {
  font-size: .85rem; line-height: 1.6;
  color: rgba(255,255,255,.72); margin: 0;
}

/* ── Sección historia (ipd-historia) ─────────────────────────── */
.ipd-historia {
  display: grid; grid-template-columns: 1fr 1fr;
  align-items: stretch;
  background: var(--ipd-forest); color: #fff;
}
.ipd-historia-media {
  position: relative; min-height: 420px; overflow: hidden;
}
.ipd-historia-media img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover;
}
.ipd-historia-copy {
  padding: clamp(2.5rem,6vw,5rem);
  display: flex; flex-direction: column; justify-content: center;
  background:
    linear-gradient(135deg, rgba(8,39,25,.98), rgba(18,63,40,.94)),
    #082719;
}
.ipd-historia-copy h2 {
  font-family: var(--ipd-disp); font-weight: 400;
  font-size: clamp(2rem,5vw,3.2rem); line-height: 1.04;
  color: #fff; margin: .6rem 0 1.2rem;
}
.ipd-historia-copy p {
  font-size: .98rem; line-height: 1.8;
  color: rgba(255,255,255,.82); margin: 0 0 1rem;
  max-width: 460px;
}
.ipd-historia-sign {
  font-size: .7rem; font-weight: 800; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ipd-lime);
  margin-top: 1rem; padding-top: 1rem;
  border-top: 1px solid rgba(255,255,255,.12);
}

/* ── Otros productos ─────────────────────────────────────────── */
.ipd-otros {
  padding: clamp(3rem,8vw,6rem) clamp(1.15rem,5vw,5rem);
  background: var(--ipd-paper);
}
.ipd-otros-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(1rem,3vw,1.8rem); max-width: 960px; margin: 0 auto;
}
.ipd-otro {
  display: flex; flex-direction: column;
  background: #fff; border-radius: 12px; overflow: hidden;
  border: 1px solid rgba(16,36,23,.07);
  box-shadow: 0 8px 24px rgba(16,36,23,.07);
  text-decoration: none !important; color: var(--ipd-ink) !important;
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s;
}
.ipd-otro:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 52px rgba(16,36,23,.16);
}
.ipd-otro-photo {
  aspect-ratio: 1/1; background: var(--lt);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.ipd-otro-photo img {
  width: 80%; height: 80%; object-fit: contain;
  transition: transform .5s cubic-bezier(.2,.7,.2,1);
}
.ipd-otro:hover .ipd-otro-photo img { transform: scale(1.06); }
.ipd-otro-tx {
  padding: 1.2rem 1.3rem 1.4rem;
  display: flex; flex-direction: column; gap: .3rem;
}
.ipd-otro-name {
  font-family: var(--ipd-disp); font-weight: 500;
  font-size: 1.6rem; color: var(--ipd-forest);
}
.ipd-otro-tags {
  font-size: .72rem; font-weight: 700; letter-spacing: .05em;
  color: var(--acc); text-transform: uppercase;
}

/* ── CTA final ───────────────────────────────────────────────── */
.ipd-cta {
  padding: clamp(3rem,8vw,5.5rem) clamp(1.15rem,5vw,5rem);
  text-align: center;
  background:
    linear-gradient(135deg, var(--ipd-forest), rgba(18,63,40,.96)),
    #082719;
  color: #fff;
}
.ipd-cta-inner {
  max-width: 580px; margin: 0 auto;
}
.ipd-cta-inner h2 {
  font-family: var(--ipd-disp); font-weight: 400;
  font-size: clamp(2.2rem,6vw,3.8rem); line-height: 1.04;
  margin: 0 0 1rem; color: #fff;
}
.ipd-cta-inner p {
  font-size: 1.02rem; line-height: 1.7;
  color: rgba(255,255,255,.84); margin: 0 0 1.8rem;
}
.ipd-cta-wa {
  display: inline-flex; align-items: center; gap: .6rem;
  background: #25d366; color: #062f1d !important;
  text-decoration: none !important; font-weight: 900;
  font-size: 1rem; padding: 1.05rem 2.4rem;
  border-radius: 100px; min-height: 52px;
  box-shadow: 0 14px 44px rgba(37,211,102,.4), 0 4px 12px rgba(37,211,102,.2);
  transition: transform .22s, box-shadow .22s;
  letter-spacing: .01em;
}
.ipd-cta-wa:hover {
  transform: translateY(-3px);
  box-shadow: 0 22px 56px rgba(37,211,102,.5), 0 6px 18px rgba(37,211,102,.28);
}
.ipd-cta-back {
  display: block; margin-top: 1.5rem;
  font-size: .82rem; font-weight: 700;
  color: rgba(255,255,255,.85) !important;
  text-decoration: underline !important;
  transition: color .2s;
}
.ipd-cta-back:hover { color: #fff !important; }

/* ── Reveal animation ────────────────────────────────────────── */
.ipd .bb-reveal {
  opacity: 0; transform: translateY(28px);
  transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
}
.ipd .bb-reveal.bb-in {
  opacity: 1; transform: translateY(0);
}

/* ── RESPONSIVE ──────────────────────────────────────────────── */
@media (max-width: 980px) {
  .ipd-hero {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .ipd-hero-photo {
    max-width: 480px; margin: 0 auto;
  }
  .ipd-historia {
    grid-template-columns: 1fr;
  }
  .ipd-historia-media { min-height: 320px; }
}

@media (max-width: 680px) {
  .ipd-plants {
    grid-template-columns: 1fr;
    max-width: 420px;
  }
  .ipd-steps {
    grid-template-columns: 1fr 1fr;
    gap: 1.4rem;
  }
  .ipd-otros-grid {
    grid-template-columns: 1fr;
    max-width: 340px; margin: 0 auto;
  }
  .ipd-hero {
    padding: 1.8rem 1rem;
  }
  .ipd-hero-photo {
    max-width: 100%;
    aspect-ratio: auto;
  }
  .ipd-hero-photo img {
    padding: 1rem;
  }
  .ipd-name {
    font-size: clamp(2.6rem, 12vw, 3.6rem);
  }
  .ipd-buy {
    width: 100%; justify-content: center;
  }
  .ipd-historia-media { min-height: 280px; }
  .ipd-crumb {
    font-size: .7rem;
    padding: .9rem 1rem;
  }
}

@media (max-width: 420px) {
  .ipd-steps {
    grid-template-columns: 1fr;
  }
  .ipd-pills span {
    flex: 1 1 calc(50% - .2rem);
    text-align: center;
  }
  .ipd-hero {
    padding: 1.3rem .85rem;
  }
}

/* ── Overflow safety ─────────────────────────────────────────── */
.ipd,
.ipd .ipd-hero,
.ipd .ipd-hero-info,
.ipd .ipd-bot,
.ipd .ipd-prep,
.ipd .ipd-historia,
.ipd .ipd-otros,
.ipd .ipd-cta {
  min-width: 0; max-width: 100%;
  overflow-x: clip;
}

.ipd .ipd-sens,
.ipd .ipd-plant p,
.ipd .ipd-step-tx p,
.ipd .ipd-historia-copy p,
.ipd .ipd-cta-inner p {
  overflow-wrap: anywhere;
  white-space: normal !important;
}

/* ── Override: ipd inside bb-clean-product ────────────────────── */
#bb-clean-product .ipd {
  background: var(--ipd-paper) !important;
}

/* ════════════════════════════════════════════════════════════════
   MICRO-MEJORAS: Cards stagger entrance + proofbar counter
   ════════════════════════════════════════════════════════════════ */

/* Cards de infusiones — entrada escalonada */
@keyframes infCardIn {
  from { opacity: 0; transform: translateY(32px) scale(.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
#san-catalog .inf-card.bb-reveal {
  opacity: 0;
}
#san-catalog .inf-card.bb-reveal.bb-in {
  animation: infCardIn .65s cubic-bezier(.2,.7,.2,1) both;
}
#san-catalog .inf-card.bb-reveal.bb-in:nth-child(1) { animation-delay: 0s; }
#san-catalog .inf-card.bb-reveal.bb-in:nth-child(2) { animation-delay: .1s; }
#san-catalog .inf-card.bb-reveal.bb-in:nth-child(3) { animation-delay: .2s; }
#san-catalog .inf-card.bb-reveal.bb-in:nth-child(4) { animation-delay: .3s; }

/* Proofbar numbers — smooth count appearance */
@keyframes proofFadeUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
#san-catalog .inf-proofbar div {
  animation: proofFadeUp .5s ease-out both;
}
#san-catalog .inf-proofbar div:nth-child(1) { animation-delay: .05s; }
#san-catalog .inf-proofbar div:nth-child(2) { animation-delay: .15s; }
#san-catalog .inf-proofbar div:nth-child(3) { animation-delay: .25s; }
#san-catalog .inf-proofbar div:nth-child(4) { animation-delay: .35s; }

/* Smooth scroll for anchor links */
#san-catalog { scroll-behavior: smooth; }
.ipd { scroll-behavior: smooth; }

/* Product pages: reliable static-export navigation */
body.bb-has-product-nav #bb-product-nav {
  align-items: center;
  background: rgba(255, 253, 248, .96);
  border-bottom: 1px solid rgba(16, 36, 23, .12);
  box-shadow: 0 14px 34px rgba(6, 47, 29, .08);
  display: flex;
  gap: clamp(.8rem, 2vw, 1.5rem);
  justify-content: space-between;
  min-height: 72px;
  padding: .75rem clamp(1rem, 4vw, 4.5rem);
  position: sticky;
  top: 0;
  z-index: 120000;
}

body.bb-has-product-nav #bb-product-nav,
body.bb-has-product-nav #bb-product-nav * {
  box-sizing: border-box;
}

.bb-product-nav__brand,
.bb-product-nav__links a,
.bb-product-nav__wa {
  text-decoration: none !important;
}

.bb-product-nav__brand {
  color: #102417 !important;
  display: inline-flex;
  flex-direction: column;
  line-height: 1;
  min-width: 132px;
}

.bb-product-nav__brand span {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.72rem;
  font-weight: 600;
  letter-spacing: 0;
}

.bb-product-nav__brand small {
  color: #536359;
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .08em;
  margin-top: .18rem;
  text-transform: uppercase;
}

.bb-product-nav__links {
  align-items: center;
  display: flex;
  flex: 1 1 auto;
  gap: .25rem;
  justify-content: center;
}

.bb-product-nav__links a {
  border-radius: 999px;
  color: #102417 !important;
  font-size: .86rem;
  font-weight: 900;
  letter-spacing: .02em;
  padding: .62rem .9rem;
  text-transform: uppercase;
}

.bb-product-nav__links a:hover,
.bb-product-nav__links a:focus-visible {
  background: #0b6f3c;
  color: #fffdf8 !important;
}

.bb-product-nav__wa {
  align-items: center;
  background: #0b6f3c;
  border-radius: 999px;
  color: #fffdf8 !important;
  display: inline-flex;
  font-size: .86rem;
  font-weight: 900;
  justify-content: center;
  min-height: 42px;
  padding: .7rem 1.05rem;
  white-space: nowrap;
}

.bb-product-nav__menu {
  align-items: center;
  background: #fffdf8;
  border: 1px solid rgba(16, 36, 23, .18);
  border-radius: 50%;
  display: none;
  flex: 0 0 44px;
  height: 44px;
  justify-content: center;
  padding: 0;
  width: 44px;
}

.bb-product-nav__menu span {
  background: #102417;
  border-radius: 2px;
  display: block;
  height: 2px;
  position: absolute;
  width: 18px;
}

.bb-product-nav__menu span:nth-child(1) { transform: translateY(-6px); }
.bb-product-nav__menu span:nth-child(3) { transform: translateY(6px); }

@media (max-width: 780px) {
  body.bb-has-product-nav #bb-product-nav {
    min-height: 66px;
    padding: .58rem .9rem;
  }

  .bb-product-nav__brand {
    min-width: 0;
  }

  .bb-product-nav__brand span {
    font-size: 1.5rem;
  }

  .bb-product-nav__brand small {
    font-size: .58rem;
  }

  .bb-product-nav__links,
  .bb-product-nav__wa {
    display: none;
  }

  .bb-product-nav__menu {
    display: inline-flex;
  }
}

/* Final contrast guard: text that sits on green panels must be white. */
html body :where(
  #bb-clean-product .ipd-prep,
  #bb-clean-product .ipd-historia,
  #bb-clean-product .ipd-cta,
  #caf-page .caf-s4,
  #caf-page .caf-s6,
  #san-catalog .inf-historia,
  #san-catalog .inf-cta,
  #san-catalog .san-blog,
  #ker-catalog .ker-origin,
  #ker-gallery .kg-cta,
  #footer,
  footer
) :where(h1,h2,h3,h4,h5,h6,p,li,span,strong,em,b,small) {
  color: #fffdf8 !important;
}

html body :where(
  #bb-clean-product .ipd-prep,
  #bb-clean-product .ipd-historia,
  #bb-clean-product .ipd-cta,
  #caf-page .caf-s4,
  #caf-page .caf-s6,
  #san-catalog .inf-historia,
  #san-catalog .inf-cta,
  #san-catalog .san-blog,
  #ker-catalog .ker-origin,
  #ker-gallery .kg-cta,
  #footer,
  footer
) a:not(.ipd-cta-wa):not(.inf-cta-wa):not(.caf-s6-btn):not(.bb-mnav-wa) {
  color: #fffdf8 !important;
  text-decoration-color: rgba(255, 253, 248, .55) !important;
}

/* ═══════════════════════════════════════════════════════════════
   BIOBOSKE · PRODUCT POLISH v15.3
   ═══════════════════════════════════════════════════════════════ */

/* ── Flash prevention ─────────────────────────────────────────
   The static placeholder is hidden until JS fires and swaps it.
   .sanate-product-static is on #bb-clean-product before takeover.  */
html.bb-route-ceramica body#product .sanate-product-static,
html.bb-route-infusiones body#product .sanate-product-static {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: none !important;
}

/* ── Texto blanco sobre verde ─────────────────────────────── */
.ipd-cta-inner p  { color: rgba(255,255,255,.96) !important; }
.ipd-cta-inner h2 { color: #fff !important; }
.ipd-cta-back     { color: rgba(255,255,255,.9) !important; }
#sanate-topbar    { color: #fff !important; }
#sanate-topbar *  { color: #fff !important; }

/* ── Cerámica: diseño que eleva la pieza ─────────────────── */

/* Wrapper: fondo papel cálido (ya hereda .ipd pero reforzamos) */
#ker-gallery { background: var(--ipd-paper, #f6f0e6) !important; }

/* Ceramica product page: ensure gallery has height and content isn't clipped.
   The shared `:where(#ker-gallery)` rule adds overflow:hidden which kills
   position:sticky on .kg-left AND can visually collapse the gallery. */
html.bb-route-ceramica.bb-route-product #ker-gallery {
  overflow: visible !important;
  min-height: 600px !important;
  display: block !important;
  margin-bottom: 0 !important;
}

/* Kill the white footer gap on all custom route pages.
   PS8 theme.css adds background:#fff + padding-top:2.5rem to #footer —
   those show as a pale stripe between the dark CTA and the dark newsletter. */
html.bb-route-ceramica.bb-route-product #footer,
html.bb-route-infusiones.bb-route-product #footer,
html.bb-route-cafe #footer {
  background: transparent !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Layout: respiración real en desktop */
.kg-layout {
  grid-template-columns: 1.1fr .9fr !important;
  gap: clamp(2.5rem, 5vw, 5rem) !important;
  padding: clamp(2.5rem, 6vw, 5rem) clamp(1.5rem, 5vw, 4.5rem) !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}

/* Stage: fondo neutro cálido, sombra artesanal, objeto completo */
.kg-stage {
  background: #fdf9f5 !important;
  box-shadow:
    0 6px 40px rgba(110,47,18,.13),
    0 1px 4px rgba(110,47,18,.07),
    inset 0 0 0 1px rgba(110,47,18,.07) !important;
  border-radius: 20px !important;
  min-height: 420px !important;
}

/* object-fit: contain = vemos la pieza COMPLETA, sin recorte */
#kg-main-img {
  object-fit: contain !important;
  padding: clamp(.75rem, 4%, 2.5rem) !important;
}

/* Thumbnails más grandes */
.kg-thumbs {
  grid-template-columns: repeat(auto-fill, 74px) !important;
  gap: .55rem !important;
  margin-top: .9rem !important;
}
.kg-thumb        { width:74px; height:74px; border-radius:10px; border-width:2px !important; }
.kg-thumb.active { border-color: var(--s-terra) !important; box-shadow: 0 0 0 2px var(--s-terra) !important; }

/* Nombre: Cormorant Garamond, grande, noble */
.kg-prod-name {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2rem, 4.5vw, 3.2rem) !important;
  font-weight: 400 !important;
  letter-spacing: -.015em !important;
  line-height: 1.06 !important;
  color: #1a0a04 !important;
  margin: .2rem 0 1rem !important;
}

/* Precio: elegante, proporcionado */
.kg-prod-price {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(2.2rem, 5vw, 3rem) !important;
  font-weight: 300 !important;
  letter-spacing: -.03em !important;
  line-height: 1 !important;
  margin-bottom: 1.4rem !important;
}

/* Descripción: legible, cálida */
.kg-desc {
  font-size: .96rem !important;
  color: #3d2416 !important;
  line-height: 1.82 !important;
  margin-bottom: 1.6rem !important;
}

/* Botón Comprar: ancho completo, generoso */
.kg-wa-btn {
  width: 100% !important;
  justify-content: center !important;
  padding: .95rem 1.5rem !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
  margin-bottom: .1rem !important;
}

/* Sello: sutil, no compite */
.kg-seal {
  font-size: .8rem !important;
  color: var(--s-verde) !important;
  margin-top: 1.1rem !important;
  opacity: .85 !important;
}

/* Intro cultural encima del layout */
.kg-intro {
  text-align: center;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--s-arcilla, #D4845A);
  padding: 1.2rem clamp(1.5rem, 5vw, 4.5rem) .2rem;
  opacity: .8;
}

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 820px) {
  .kg-layout {
    grid-template-columns: 1fr !important;
    padding: 1.5rem 1.15rem !important;
    gap: 1.5rem !important;
  }
  .kg-left  { position: static !important; top: auto !important; }
  .kg-stage { min-height: 280px !important; border-radius: 14px !important; }
}

/* ── Pills del hero de infusiones: chips informativos, no botones ─────────── */
.inf-hero-pills {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .45rem !important;
  pointer-events: none !important;
  margin-top: 1rem !important;
}
.inf-hero-pills span {
  display: inline-block !important;
  background: rgba(255,255,255,.1) !important;
  border: 1px solid rgba(255,255,255,.32) !important;
  border-radius: 2em !important;
  padding: .22em .9em !important;
  font-size: .68rem !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  color: rgba(255,255,255,.88) !important;
  cursor: default !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}

/* ── Texto blanco en secciones oscuras de páginas de infusión ────────────── */
/* Sección preparación (ipd-prep) */
.ipd-prep .inf-eyebrow--light,
.ipd-prep .ipd-step-n       { color: rgba(255,255,255,.65) !important; }
.ipd-prep h2,
.ipd-prep h4                { color: #fff !important; }
.ipd-prep p                 { color: rgba(255,255,255,.78) !important; }
/* Sección quién la hace (ipd-historia) en páginas de producto */
.ipd-historia .inf-eyebrow--light { color: rgba(255,255,255,.65) !important; }
.ipd-historia h2            { color: #fff !important; }
.ipd-historia p             { color: rgba(255,255,255,.82) !important; }
/* Sección historia en catálogo de infusiones */
.inf-historia .inf-eyebrow--light { color: rgba(255,255,255,.65) !important; }
.inf-historia .inf-historia-h,
.inf-historia h2            { color: #fff !important; }
.inf-historia p             { color: rgba(255,255,255,.82) !important; }
.inf-historia .inf-historia-stats b { color: #fff !important; }
.inf-historia .inf-historia-stats span { color: rgba(255,255,255,.65) !important; }

/* ── Anti-flash: oculta contenido estático PrestaShop hasta que JS inyecte
      el contenido real en section#content ─────────────────────────────────── */
html.bb-route-ceramica.bb-route-product section#content:not(:has(#ker-gallery)) {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: none !important;
}
html.bb-route-cafe.bb-route-product section#content:not(:has(#caf-page)):not(:has(#caf-pd)):not(:has(#bb-clean-product)) {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: none !important;
}
html.bb-route-infusiones.bb-route-product section#content:not(:has(#bb-clean-product)) {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: none !important;
}

/* ── Anti-flash header: carrito y cuenta ocultos hasta que JS los reemplaza ──
   JS inserta .bb-header-social (visible) y pone display:none en el carrito.
   Así el carrito/Regístrate nunca se ven en el primer frame.              */
.elementor-widget-shopping-cart,
[data-widget_type="sign-in.default"],
.elementor-widget-sign-in {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: none !important;
}

/* ═══════════════════════════════════════════════════════════════════
   INFUSIONES PRODUCT PAGES — REDESIGN: BELLEZA · TRASCENDENCIA · PAZ
   ═══════════════════════════════════════════════════════════════════ */

/* — Acento dorado: reemplaza el lima eléctrico en secciones oscuras — */
.ipd-step-n {
  color: #c8a96e !important;
  font-weight: 200 !important;
  font-style: italic !important;
  font-size: clamp(3.2rem,5vw,4.5rem) !important;
  opacity: .85;
}
.ipd-historia-sign { color: #c8a96e !important; }

/* — Eyebrows en oscuro: oro con tracking generoso — */
.ipd-prep .inf-eyebrow--light,
.ipd-historia-copy .inf-eyebrow--light {
  color: #c8a96e !important;
  letter-spacing: .22em !important;
  font-size: .67rem !important;
}

/* — Separadores de paso: más finos, más delicados — */
.ipd-step {
  border-top: 1px solid rgba(255,255,255,.11) !important;
  padding-top: 1.8rem !important;
  gap: 1rem !important;
}

/* — Título de paso: peso medio, más aéreo — */
.ipd-step-tx h4 {
  font-weight: 500 !important;
  font-size: 1rem !important;
  letter-spacing: .015em !important;
  color: #fff !important;
}
.ipd-step-tx p {
  line-height: 1.82 !important;
  color: rgba(255,255,255,.62) !important;
}

/* — Sección preparación: más aire vertical — */
.ipd-prep {
  padding-top:    clamp(5.5rem,11vw,9rem) !important;
  padding-bottom: clamp(5.5rem,11vw,9rem) !important;
}
.ipd-prep .ipd-sec-head {
  margin-bottom: 4.5rem !important;
}
.ipd-prep .ipd-sec-head h2 {
  font-weight: 300 !important;
  letter-spacing: -.01em !important;
  font-size: clamp(2.2rem,5vw,3.4rem) !important;
}

/* — Historia copy: más espacio y línea decorativa dorada — */
.ipd-historia-copy {
  padding: clamp(4.5rem,9vw,7.5rem) clamp(3rem,6vw,5.5rem) !important;
  position: relative;
}
.ipd-historia-copy::before {
  content: '';
  position: absolute;
  top: clamp(4.5rem,9vw,7.5rem);
  left: clamp(3rem,6vw,5.5rem);
  width: 2.8rem; height: 1px;
  background: linear-gradient(90deg,#c8a96e 60%,transparent);
}
.ipd-historia-copy h2 {
  font-weight: 300 !important;
  font-size: clamp(2.4rem,5.5vw,3.8rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -.015em !important;
  margin-top: 2rem !important;
  color: #fff !important;
}
.ipd-historia-copy p {
  line-height: 1.92 !important;
  color: rgba(255,255,255,.74) !important;
  font-size: .97rem !important;
}
.ipd-historia-sign {
  letter-spacing: .18em !important;
  font-size: .63rem !important;
  margin-top: 2.2rem !important;
  padding-top: 1.6rem !important;
  border-top-color: rgba(200,169,110,.22) !important;
}

/* — CTA: oscuro profundo, sereno — */
.ipd-cta {
  padding-top:    clamp(5.5rem,12vw,9.5rem) !important;
  padding-bottom: clamp(5.5rem,12vw,9.5rem) !important;
  background: linear-gradient(160deg,#050d07 0%,#082719 55%,#0d3320 100%) !important;
}
.ipd-cta-inner h2 {
  font-weight: 300 !important;
  letter-spacing: -.02em !important;
  font-size: clamp(2.8rem,7vw,4.8rem) !important;
  line-height: 1.0 !important;
  margin-bottom: 1.3rem !important;
  color: #fff !important;
}
.ipd-cta-inner p {
  color: rgba(255,255,255,.62) !important;
  line-height: 1.88 !important;
  margin-bottom: 2.6rem !important;
}
.ipd-cta-wa {
  border-radius: 100px !important;
  padding: 1.1rem 2.8rem !important;
  letter-spacing: .02em !important;
  font-size: .96rem !important;
  min-height: 54px !important;
  vertical-align: middle !important;
  box-shadow: 0 16px 52px rgba(37,211,102,.32), 0 4px 14px rgba(37,211,102,.18) !important;
}
.ipd-cta-wa:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 24px 68px rgba(37,211,102,.42), 0 6px 20px rgba(37,211,102,.26) !important;
}
.ipd-cta-back {
  display: inline-flex !important;
  align-items: center !important;
  gap: .4rem !important;
  margin-top: 0 !important;
  margin-left: 1.8rem !important;
  padding: .85rem 2rem !important;
  border: 1.5px solid rgba(255,255,255,.25) !important;
  border-radius: 100px !important;
  font-size: .76rem !important;
  font-weight: 600 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.62) !important;
  text-decoration: none !important;
  background: rgba(255,255,255,.04) !important;
  vertical-align: middle !important;
  transition: border-color .25s, color .25s, background .25s !important;
}
.ipd-cta-back:hover {
  color: #fff !important;
  border-color: rgba(255,255,255,.55) !important;
  background: rgba(255,255,255,.1) !important;
}
/* En mobile apilan verticalmente */
@media (max-width: 540px) {
  .ipd-cta-back {
    margin-left: 0 !important;
    margin-top: 1.2rem !important;
    display: flex !important;
    justify-content: center !important;
  }
}

/* ── FUERZA MÁXIMA: ID + clase para ganar a theme.css !important ── */
#bb-clean-product .ipd-prep h2,
#bb-clean-product .ipd-prep h4,
#bb-clean-product .ipd-step-tx h4  { color: #fff !important; }

#bb-clean-product .ipd-prep p,
#bb-clean-product .ipd-step-tx p   { color: rgba(255,255,255,.82) !important; }

#bb-clean-product .ipd-prep .inf-eyebrow,
#bb-clean-product .ipd-prep .inf-eyebrow--light,
#bb-clean-product .ipd-prep span   { color: #c8a96e !important; }

#bb-clean-product .ipd-historia-copy h2   { color: #fff !important; }
#bb-clean-product .ipd-historia-copy p    { color: rgba(255,255,255,.82) !important; }
#bb-clean-product .ipd-historia-copy span { color: #c8a96e !important; }
#bb-clean-product .ipd-historia-copy .inf-eyebrow,
#bb-clean-product .ipd-historia-copy .inf-eyebrow--light { color: #c8a96e !important; }
#bb-clean-product .ipd-historia-sign      { color: #c8a96e !important; }

#bb-clean-product .ipd-cta-inner h2  { color: #fff !important; }
#bb-clean-product .ipd-cta-inner p   { color: rgba(255,255,255,.78) !important; }
#bb-clean-product .ipd-cta-back      { color: rgba(255,255,255,.62) !important; }

/* ═══════════════════════════════════════════════════════════════════
   CAFÉ — Texto en secciones oscuras (ID máxima especificidad)
   ═══════════════════════════════════════════════════════════════════ */

/* — Sección compromisos (caf-s4, fondo verde oscuro) — */
#caf-page .caf-s4-label      { color: rgba(212,160,48,.9) !important; }
#caf-page .caf-s4-h2         { color: #fff !important; }
#caf-page .caf-s4-n          { color: rgba(168,112,18,.32) !important; }
#caf-page .caf-s4-body h3    { color: #fff !important; }
#caf-page .caf-s4-body p     { color: rgba(255,255,255,.8) !important; }

/* — Sección impacto (caf-s5, fondo ámbar) — */
#caf-page .caf-s5-n          { color: #fff !important; }
#caf-page .caf-s5-lbl        { color: rgba(255,255,255,.88) !important; }

/* — Hero café (caf-s1, imagen oscura con overlay) — */
#caf-page .caf-s1-atasim     { color: #fff !important; }
#caf-page .caf-s1-coffee     { color: var(--cf-gold-lt,#D4A030) !important; }
#caf-page .caf-s1-story      { color: rgba(255,255,255,.8) !important; }
#caf-page .caf-s1-loc        { color: rgba(255,255,255,.72) !important; }
#caf-page .caf-s1-badge      { color: rgba(255,255,255,.88) !important; }
#caf-page .caf-s1-points span { color: rgba(255,255,255,.82) !important; }

/* — Café PRODUCTO (mismas secciones dentro de #bb-clean-product) — */
#bb-clean-product #caf-page .caf-s4-label   { color: rgba(212,160,48,.9) !important; }
#bb-clean-product #caf-page .caf-s4-h2      { color: #fff !important; }
#bb-clean-product #caf-page .caf-s4-n       { color: rgba(168,112,18,.32) !important; }
#bb-clean-product #caf-page .caf-s4-body h3 { color: #fff !important; }
#bb-clean-product #caf-page .caf-s4-body p  { color: rgba(255,255,255,.8) !important; }
#bb-clean-product #caf-page .caf-s5-n       { color: #fff !important; }
#bb-clean-product #caf-page .caf-s5-lbl     { color: rgba(255,255,255,.88) !important; }

/* ═══════════════════════════════════════════════════════════════════
   RESPONSIVE — Ajustes para los nuevos estilos en móvil
   ═══════════════════════════════════════════════════════════════════ */

@media (max-width: 980px) {
  /* Historia: línea decorativa oculta en móvil (grid stacked) */
  .ipd-historia-copy::before { display: none; }

  /* Historia copy: padding más compacto en tablet */
  .ipd-historia-copy {
    padding: 3.5rem 2.5rem !important;
  }
  .ipd-historia-copy h2 {
    margin-top: 1rem !important;
    font-size: clamp(2rem,6vw,3rem) !important;
  }

  /* Prep: reducir padding vertical */
  .ipd-prep {
    padding-top:    clamp(4rem,8vw,6rem) !important;
    padding-bottom: clamp(4rem,8vw,6rem) !important;
  }
  .ipd-prep .ipd-sec-head { margin-bottom: 3rem !important; }

  /* CTA: compactar */
  .ipd-cta {
    padding-top:    clamp(4rem,8vw,6rem) !important;
    padding-bottom: clamp(4rem,8vw,6rem) !important;
  }
}

@media (max-width: 600px) {
  /* Historia copy: padding mínimo en móvil */
  .ipd-historia-copy {
    padding: 2.8rem 1.5rem !important;
  }
  .ipd-historia-copy h2 {
    font-size: clamp(1.9rem,8vw,2.6rem) !important;
  }

  /* Prep: pasos en columna única — números más pequeños */
  .ipd-step-n {
    font-size: 2.6rem !important;
  }

  /* Café responsive: compromisos en móvil */
  #caf-page .caf-s4 { padding: 3.5rem 1.2rem !important; }
  #caf-page .caf-s4-hd { margin-bottom: 2.5rem !important; }

  /* Café producto CTA responsive */
  #bb-clean-product #caf-page .ipd-cta { padding: 4rem 1.5rem !important; }
  #bb-clean-product #caf-page .ipd-cta-inner h2 { font-size: clamp(2rem,7vw,3rem) !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   CAFÉ PRODUCTO — Doble ID para máxima especificidad (aplasta theme.css)
   ═══════════════════════════════════════════════════════════════════ */
#bb-clean-product #caf-page .ipd-cta                { color: #fff !important; }
#bb-clean-product #caf-page .ipd-cta-inner h2       { color: #fff !important; font-weight: 300 !important; letter-spacing: -.02em !important; }
#bb-clean-product #caf-page .ipd-cta-inner p        { color: rgba(255,255,255,.72) !important; }
#bb-clean-product #caf-page .ipd-cta-back           { color: rgba(255,255,255,.55) !important; }
#bb-clean-product #caf-page .caf-s3-h2              { color: var(--cf-forest,#0A1A0C) !important; }
#bb-clean-product #caf-page .caf-s3-label           { color: var(--cf-gold,#A87012) !important; }
#bb-clean-product #caf-page .caf-s3-specs span      { color: var(--cf-smoke,#4A3A26) !important; }
#bb-clean-product #caf-page .caf-s3-specs b         { color: var(--cf-ink,#150E05) !important; }
#bb-clean-product #caf-page .caf-s3-price           { color: var(--cf-gold,#A87012) !important; }

/* ═══════════════════════════════════════════════════════════════════
   CAFÉ PRODUCTO — Rediseño completo (#caf-pd)
   Colores explícitos: cero herencia de variables de PrestaShop
   ═══════════════════════════════════════════════════════════════════ */
#caf-pd {
  font-family: 'Cormorant Garamond', Georgia, serif;
  background: #f5ede2;
  color: #150E05;
}

/* Breadcrumb */
#caf-pd .cpd-crumb {
  display: flex; align-items: center; gap: .5rem;
  padding: 1rem clamp(1.5rem,5vw,4rem);
  font-family: system-ui, sans-serif;
  font-size: .72rem; font-weight: 600; letter-spacing: .04em;
  background: #fff; border-bottom: 1px solid rgba(10,26,12,.08);
  color: #4A3A26;
}
#caf-pd .cpd-crumb a { color: #A87012; text-decoration: none; }
#caf-pd .cpd-crumb span { color: rgba(10,26,12,.25); }
#caf-pd .cpd-crumb b { color: #150E05; font-weight: 600; }

/* Split producto */
#caf-pd .cpd-split {
  display: grid; grid-template-columns: 1fr 1fr;
  align-items: stretch;
}
#caf-pd .cpd-img {
  background: #ece4d8;
  display: flex; align-items: center; justify-content: center;
  padding: clamp(3rem,6vw,5rem);
  min-height: 500px;
}
#caf-pd .cpd-img img {
  max-width: 100%; max-height: 460px; object-fit: contain;
  filter: drop-shadow(0 28px 72px rgba(0,0,0,.28));
  transition: transform .55s cubic-bezier(.4,0,.2,1);
}
#caf-pd .cpd-img:hover img { transform: scale(1.04) translateY(-6px); }

#caf-pd .cpd-body {
  background: #fff;
  padding: clamp(3rem,6vw,5rem) clamp(2.5rem,5vw,4.5rem);
  display: flex; flex-direction: column; justify-content: center; gap: 1.6rem;
}
#caf-pd .cpd-brand {
  font-family: system-ui, sans-serif;
  font-size: .6rem; font-weight: 800; letter-spacing: .22em;
  text-transform: uppercase; color: #A87012;
}
#caf-pd .cpd-name {
  font-size: clamp(2.2rem,4vw,3.4rem); font-weight: 400;
  line-height: 1.0; letter-spacing: -.02em; color: #0A1A0C; margin: 0;
}
#caf-pd .cpd-name em { font-style: italic; font-weight: 300; }
#caf-pd .cpd-lema {
  font-family: system-ui, sans-serif;
  font-size: .72rem; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: rgba(10,26,12,.38); margin: -.8rem 0 0;
}
#caf-pd .cpd-specs {
  display: grid; grid-template-columns: 1fr 1fr;
  border: 1px solid rgba(10,26,12,.1); border-radius: 10px; overflow: hidden;
}
#caf-pd .cpd-specs > div {
  padding: .65rem 1rem; display: flex; flex-direction: column; gap: .06rem;
  border-right: 1px solid rgba(10,26,12,.08);
  border-bottom: 1px solid rgba(10,26,12,.08);
}
#caf-pd .cpd-specs > div:nth-child(even) { border-right: none; }
#caf-pd .cpd-specs > div:nth-last-child(-n+2) { border-bottom: none; }
#caf-pd .cpd-specs span {
  font-family: system-ui, sans-serif;
  font-size: .57rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: rgba(10,26,12,.38);
}
#caf-pd .cpd-specs b {
  font-family: system-ui, sans-serif;
  font-size: .9rem; font-weight: 700; color: #150E05;
}
#caf-pd .cpd-buy {
  display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap;
  padding-top: 1.5rem; border-top: 1px solid rgba(10,26,12,.1);
}
#caf-pd .cpd-price {
  font-size: 3.2rem; font-weight: 300; letter-spacing: -.04em;
  color: #A87012; line-height: 1;
}
#caf-pd .cpd-btn {
  display: inline-flex; align-items: center; gap: .55rem;
  background: #25d366; color: #062f1d;
  font-family: system-ui, sans-serif; font-size: .94rem; font-weight: 800;
  text-decoration: none; padding: 1.05rem 2.2rem; border-radius: 100px;
  min-height: 52px; letter-spacing: .01em;
  box-shadow: 0 14px 42px rgba(37,211,102,.38), 0 4px 12px rgba(37,211,102,.2);
  transition: transform .22s, box-shadow .22s;
}
#caf-pd .cpd-btn:hover { transform: translateY(-3px); box-shadow: 0 20px 54px rgba(37,211,102,.48), 0 6px 18px rgba(37,211,102,.28); }
#caf-pd .cpd-seal {
  font-family: system-ui, sans-serif;
  font-size: .65rem; letter-spacing: .07em; color: rgba(10,26,12,.35);
  text-transform: uppercase; margin: 0;
}

/* Historia de origen (fondo verde oscuro) */
#caf-pd .cpd-story {
  background: #0A1A0C;
  padding: clamp(5rem,10vw,8rem) clamp(2rem,8vw,8rem);
  display: grid; grid-template-columns: 1.3fr .7fr;
  align-items: center; gap: 5rem;
}
#caf-pd .cpd-quote {
  font-size: clamp(1.6rem,3vw,2.4rem); font-style: italic; font-weight: 400;
  color: #fff; line-height: 1.55; margin: 0;
  padding-left: 2.2rem; border-left: 2px solid #A87012; quotes: none;
}
#caf-pd .cpd-stats {
  display: flex; flex-direction: column; gap: 2.8rem;
  padding-left: 3.5rem; border-left: 1px solid rgba(255,255,255,.1);
}
#caf-pd .cpd-stat-n {
  display: block;
  font-size: clamp(3rem,6vw,5rem); font-weight: 300; letter-spacing: -.04em;
  color: #fff; line-height: .88;
}
#caf-pd .cpd-stat-l {
  display: block; font-family: system-ui, sans-serif;
  font-size: .6rem; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: rgba(212,160,48,.82); margin-top: .5rem;
}

/* CTA final (negro profundo) */
#caf-pd .cpd-cta {
  padding: clamp(6rem,12vw,10rem) clamp(2rem,6vw,6rem);
  text-align: center;
  background: linear-gradient(160deg,#040a05 0%,#0A1A0C 60%,#112614 100%);
}
#caf-pd .cpd-cta-in { max-width: 560px; margin: 0 auto; }
#caf-pd .cpd-cta-label {
  display: block; font-family: system-ui, sans-serif;
  font-size: .6rem; font-weight: 700; letter-spacing: .22em;
  text-transform: uppercase; color: rgba(212,160,48,.85); margin-bottom: 1.6rem;
}
#caf-pd .cpd-cta-h2 {
  font-size: clamp(2.8rem,7vw,4.8rem); font-weight: 300;
  letter-spacing: -.025em; line-height: 1.0; color: #fff; margin: 0 0 1.2rem;
}
#caf-pd .cpd-cta-h2 em { font-style: italic; font-weight: 300; }
#caf-pd .cpd-cta-p {
  font-family: system-ui, sans-serif;
  font-size: 1rem; line-height: 1.82; color: rgba(255,255,255,.6); margin: 0 0 2.4rem;
}
#caf-pd .cpd-cta-btn {
  display: inline-flex; align-items: center; gap: .6rem;
  background: #25d366; color: #062f1d;
  font-family: system-ui, sans-serif; font-weight: 900; font-size: .96rem;
  text-decoration: none; padding: 1.1rem 2.8rem; border-radius: 100px;
  min-height: 54px; letter-spacing: .02em;
  box-shadow: 0 16px 52px rgba(37,211,102,.32), 0 4px 14px rgba(37,211,102,.18);
  transition: transform .22s, box-shadow .22s;
}
#caf-pd .cpd-cta-btn:hover { transform: translateY(-3px); box-shadow: 0 24px 68px rgba(37,211,102,.42), 0 6px 20px rgba(37,211,102,.26); }
#caf-pd .cpd-cta-back {
  display: inline-flex; align-items: center; gap: .4rem;
  margin-top: 0;
  margin-left: 1.8rem;
  padding: .88rem 2rem;
  border: 1.5px solid rgba(255,255,255,.22);
  border-radius: 100px;
  font-family: system-ui, sans-serif; text-decoration: none;
  font-size: .74rem; font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: rgba(255,255,255,.58);
  background: rgba(255,255,255,.04);
  vertical-align: middle;
  transition: border-color .25s, color .25s, background .25s;
}
#caf-pd .cpd-cta-back:hover {
  color: #fff;
  border-color: rgba(255,255,255,.55);
  background: rgba(255,255,255,.1);
}
@media (max-width: 540px) {
  #caf-pd .cpd-cta-back {
    margin-left: 0;
    margin-top: 1.2rem;
    display: flex;
    justify-content: center;
  }
}

/* Responsive */
@media (max-width: 960px) {
  #caf-pd .cpd-split { grid-template-columns: 1fr; }
  #caf-pd .cpd-img { min-height: 380px; }
  #caf-pd .cpd-story { grid-template-columns: 1fr; gap: 3.5rem; }
  #caf-pd .cpd-stats {
    border-left: none; padding-left: 0;
    border-top: 1px solid rgba(255,255,255,.1); padding-top: 2.5rem;
    flex-direction: row; gap: 2rem; flex-wrap: wrap;
  }
}
@media (max-width: 600px) {
  #caf-pd .cpd-body { padding: 2.5rem 1.5rem; }
  #caf-pd .cpd-story { padding: 4rem 1.5rem; }
  #caf-pd .cpd-cta { padding: 4.5rem 1.5rem; }
  #caf-pd .cpd-cta-h2 { font-size: clamp(2.2rem,8vw,3.2rem); }
}

/* ══════════════════════════════════════════════════════════════
   SISTEMA DE VIDA AMBIENTAL — BioBoske v15.17
   La página respira como la selva: lento, orgánico, sin prisa.
   Todos los efectos respetan prefers-reduced-motion.
   ══════════════════════════════════════════════════════════════ */

/* ── Keyframes ── */

@keyframes bbShadeBreath {
  /* Luz que filtra el dosel — overlay hero respira */
  from { opacity: .86; }
  to   { opacity: 1; }
}

@keyframes bbGradientDrift {
  /* Gradiente vivo: luz deslizándose sobre el follaje */
  0%,100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}

@keyframes bbImgShimmer {
  /* Shimmer de luz natural sobre imágenes de producto */
  0%,100% { filter: brightness(.97) saturate(.94); }
  50%      { filter: brightness(1.07) saturate(1.09); }
}

@keyframes bbRadialPulse {
  /* Blob de luz que late detrás de secciones CTA */
  from { opacity: .05; transform: scale(.88) translate(-5%, -3%); }
  to   { opacity: .22; transform: scale(1.12) translate(5%, 3%); }
}

@keyframes bbCanopyFloat {
  /* Flotación de elementos pequeños: badges, píldoras */
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-5px); }
}

/* ── Efectos bajo prefers-reduced-motion ── */
@media (prefers-reduced-motion: no-preference) {

  /* 1 ── OVERLAYS DE HERO: luz filtrando el dosel amazónico
     El gradiente oscuro "respira" revelando y ocultando la imagen. */
  html body #bb-home .bbh-hero-shade {
    animation: bbShadeBreath 14s ease-in-out infinite alternate;
  }
  html body .bb-hero-shade,
  html body #caf-page .caf-s1-ovl {
    animation: bbShadeBreath 11s ease-in-out infinite alternate;
    animation-delay: -3s;
  }

  /* 2 ── HEADER CERÁMICA: gradiente que fluye como luz entre hojas */
  html body #ker-catalog .ker-header-bar {
    background: linear-gradient(135deg,
      #152e1e 0%, #1e4529 20%, #2d6b3a 42%,
      #3a854a 58%, #2d6b3a 74%, #1b3d26 88%, #122418 100%) !important;
    background-size: 400% 400% !important;
    animation: bbGradientDrift 20s ease infinite;
  }

  /* 3 ── IMÁGENES EN CATÁLOGOS: shimmer de luz natural
     Usa filter (no transform) para no interferir con el scale en hover. */
  html body #ker-catalog .ker-card .ker-img-wrap img {
    animation: bbImgShimmer 15s ease-in-out infinite;
  }
  html body #ker-catalog .ker-card:nth-child(3n+2) .ker-img-wrap img {
    animation-duration: 19s;
    animation-delay: -7s;
  }
  html body #ker-catalog .ker-card:nth-child(3n) .ker-img-wrap img {
    animation-duration: 22s;
    animation-delay: -13s;
  }

  html body #san-catalog .san-card .san-img-wrap img {
    animation: bbImgShimmer 17s ease-in-out infinite;
    animation-delay: -5s;
  }
  html body #san-catalog .san-card:nth-child(3n+2) .san-img-wrap img {
    animation-duration: 21s;
    animation-delay: -11s;
  }
  html body #san-catalog .san-card:nth-child(3n) .san-img-wrap img {
    animation-duration: 24s;
    animation-delay: -18s;
  }

  /* 4 ── SECCIONES CTA OSCURAS: blob de luz que late
     Un resplandor radial verde-lima late suavemente detrás del texto. */
  html body .ipd-cta {
    position: relative !important;
    overflow: hidden !important;
  }
  html body .ipd-cta::before {
    content: '';
    position: absolute;
    width: 72%; height: 82%;
    top: 9%; left: 14%;
    border-radius: 50%;
    background: radial-gradient(ellipse at center,
      rgba(197,230,23,.16) 0%, transparent 68%);
    pointer-events: none;
    z-index: 0;
    animation: bbRadialPulse 11s ease-in-out infinite alternate;
  }
  html body .ipd-cta-inner { position: relative; z-index: 1; }

  /* 5 ── PÍLDORAS / BADGES HERO: flotación staggered */
  html body #san-catalog .san-hero-pills span {
    display: inline-block;
    animation: bbCanopyFloat 8s ease-in-out infinite;
  }
  html body #san-catalog .san-hero-pills span:nth-child(2) {
    animation-duration: 10s;
    animation-delay: -3s;
  }
  html body #san-catalog .san-hero-pills span:nth-child(3) {
    animation-duration: 12s;
    animation-delay: -7s;
  }
  html body #san-catalog .san-hero-pills span:nth-child(n+4) {
    animation-duration: 9s;
    animation-delay: -5s;
  }
}

/* ═══════════════════════════════════════════════════════════
   STYLE REFRESH — Tipografía Cormorant + Hero Cinematic
   ═══════════════════════════════════════════════════════════ */

/* ── 1. DISPLAY FONT ────────────────────────────────────────
   Cormorant Garamond ya está cargado (Google Fonts, head).
   Se aplica a títulos hero, nombres de producto y precios
   para dar carácter artesanal amazónico al conjunto. */
:root { --bb-display: 'Cormorant Garamond', Georgia, serif; }

/* Hero titles */
html body .bb-hero-title {
  font-family: var(--bb-display) !important;
  font-weight: 300 !important;
  letter-spacing: .04em !important;
}

/* Nombres de producto en páginas de detalle */
html body :where(.kg-prod-name, .ipd-name, .cpd-name) {
  font-family: var(--bb-display) !important;
  font-weight: 600 !important;
  font-size: clamp(1.55rem, 3.6vw, 2.7rem) !important;
  line-height: 1.14 !important;
  letter-spacing: .01em !important;
}

/* Precios en páginas de detalle */
html body :where(.kg-prod-price, .cpd-price) {
  font-family: var(--bb-display) !important;
  font-style: italic !important;
  font-weight: 600 !important;
  font-size: clamp(1.15rem, 2.4vw, 1.65rem) !important;
}

/* Nombres en tarjetas de catálogo */
html body :where(.ker-name, .san-name) {
  font-family: var(--bb-display) !important;
  font-weight: 600 !important;
  font-size: clamp(1.05rem, 1.5vw, 1.18rem) !important;
  line-height: 1.2 !important;
}

/* Precios en tarjetas */
html body :where(.ker-price, .san-price) {
  font-family: var(--bb-display) !important;
  font-style: italic !important;
  font-weight: 400 !important;
  font-size: clamp(.92rem, 1.3vw, 1.05rem) !important;
}

/* ── 2. HERO CINEMATIC ──────────────────────────────────────
   Los elementos del hero se inyectan por JS; las animaciones
   CSS empiezan automáticamente cuando entran en el DOM.
   Título sube desde abajo, chips caen desde arriba con
   resorte (cubic-bezier overshoot). */
@media (prefers-reduced-motion: no-preference) {
  @keyframes bbSlideUpFade {
    from { opacity: 0; transform: translateY(46px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  @keyframes bbChipDrop {
    from { opacity: 0; transform: translateY(-12px) scale(.88); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
  }

  html body .bb-hero-title {
    animation: bbSlideUpFade 1s cubic-bezier(.22,1,.36,1) both !important;
  }
  html body .bb-hero-text {
    animation: bbSlideUpFade 1s cubic-bezier(.22,1,.36,1) both !important;
    animation-delay: .2s !important;
  }
  html body :where(.bb-chip, .bb-pill) {
    animation: bbChipDrop .72s cubic-bezier(.34,1.56,.64,1) both !important;
    animation-delay: .4s !important;
  }
  html body :where(.bb-chip:nth-child(2), .bb-pill:nth-child(2)) {
    animation-delay: .5s !important;
  }
  html body :where(.bb-chip:nth-child(3), .bb-pill:nth-child(3)) {
    animation-delay: .58s !important;
  }
  html body :where(.bb-chip:nth-child(n+4), .bb-pill:nth-child(n+4)) {
    animation-delay: .64s !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   FLOATING WHATSAPP BUTTON
   ═══════════════════════════════════════════════════════════ */
#bb-wa-fab {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 9990;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #25D366;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 18px rgba(37,211,102,.45), 0 2px 6px rgba(0,0,0,.18);
  text-decoration: none;
  transition: transform .22s cubic-bezier(.34,1.56,.64,1), box-shadow .22s ease;
}
#bb-wa-fab:hover {
  transform: scale(1.12);
  box-shadow: 0 8px 32px rgba(37,211,102,.58), 0 4px 12px rgba(0,0,0,.2);
  color: #fff;
  text-decoration: none;
}
#bb-wa-fab svg { display: block; flex-shrink: 0; }
@media (prefers-reduced-motion: no-preference) {
  #bb-wa-fab {
    animation: bbFABPop .55s cubic-bezier(.34,1.56,.64,1) 1.2s both;
  }
  @keyframes bbFABPop {
    from { opacity: 0; transform: scale(.4); }
    to   { opacity: 1; transform: scale(1); }
  }
}

/* ═══════════════════════════════════════════════════════════
   HERO TALLER
   ═══════════════════════════════════════════════════════════ */
#caf-page .caf-s1,
#san-catalog .san-hero.bb-hero,
#ker-catalog .ker-header-bar.bb-hero {
  min-height: 680px !important;
}
@media (max-width: 760px) {
  #caf-page .caf-s1,
  #san-catalog .san-hero.bb-hero,
  #ker-catalog .ker-header-bar.bb-hero {
    min-height: 520px !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   PROMO CAROUSEL  #bb-promo-carousel
   ═══════════════════════════════════════════════════════════ */
#bb-promo-carousel {
  background: #051A10;
  padding: 56px 0 52px;
  overflow: hidden;
  position: relative;
}
.bpc-header {
  text-align: center;
  padding: 0 24px 36px;
}
.bpc-kicker {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #C7B24A;
  margin-bottom: .7rem;
}
.bpc-title {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(2.4rem, 5vw, 3.8rem);
  font-weight: 400;
  color: #F5F0E8;
  line-height: 1.08;
  margin: 0 0 .5rem;
}
.bpc-sub {
  font-size: .83rem;
  color: rgba(245,240,232,.5);
  letter-spacing: .06em;
  margin: 0;
}
.bpc-outer {
  position: relative;
  padding: 0 56px;
}
.bpc-viewport {
  overflow: hidden;
  border-radius: 4px;
}
.bpc-track {
  display: flex;
  gap: 16px;
  transition: transform .5s cubic-bezier(.25,.46,.45,.94);
  will-change: transform;
}
.bpc-slide {
  flex: 0 0 calc((100% - 32px) / 3.12);
  min-width: 0;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  aspect-ratio: 2/3;
  cursor: pointer;
  box-shadow: 0 10px 36px rgba(0,0,0,.55);
  transition: box-shadow .3s ease;
}
.bpc-slide:hover { box-shadow: 0 16px 48px rgba(0,0,0,.7); }
.bpc-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .55s ease;
}
.bpc-slide:hover img { transform: scale(1.05); }
.bpc-slide-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top,
    rgba(5,26,16,.95) 0%,
    rgba(5,26,16,.55) 40%,
    rgba(5,26,16,.05) 68%,
    transparent 100%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 1.4rem 1.2rem 1.6rem;
}
.bpc-name {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.6rem;
  font-weight: 600;
  color: #FEFDF8;
  letter-spacing: .08em;
  line-height: 1;
  margin-bottom: .28rem;
}
.bpc-desc {
  font-size: .72rem;
  color: rgba(245,240,232,.68);
  letter-spacing: .05em;
  margin-bottom: 1rem;
  line-height: 1.45;
}
.bpc-cta {
  display: inline-block;
  background: #C7B24A;
  color: #051A10;
  padding: .44rem 1.1rem;
  border-radius: 50px;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
  align-self: flex-start;
  transition: background .2s, transform .2s;
}
.bpc-cta:hover { background: #D4C05C; transform: translateY(-1px); text-decoration: none; color: #051A10; }
.bpc-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  background: rgba(245,240,232,.1);
  border: 1.5px solid rgba(245,240,232,.2);
  color: #F5F0E8;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 1.4rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .2s;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  line-height: 1;
}
.bpc-arrow:hover { background: rgba(245,240,232,.22); }
.bpc-arrow:disabled { opacity: .25; cursor: default; pointer-events: none; }
.bpc-arrow-prev { left: 8px; }
.bpc-arrow-next { right: 8px; }
.bpc-dots {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .35rem;
  margin-top: 28px;
  padding: 0 24px;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}
.bpc-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(245,240,232,.25);
  border: none;
  padding: 0;
  cursor: pointer;
  transition: background .25s, transform .25s;
}
.bpc-dot.active { background: #C7B24A; transform: scale(1.5); }

@media (max-width: 900px) {
  .bpc-outer { padding: 0 44px; }
  .bpc-slide { flex: 0 0 calc((100% - 16px) / 2.12); }
}
@media (max-width: 560px) {
  #bb-promo-carousel { padding: 36px 0 40px; }
  .bpc-outer { padding: 0 16px; }
  .bpc-slide { flex: 0 0 76vw; }
  .bpc-arrow { display: none; }
  .bpc-header { padding-bottom: 28px; }
  .bpc-dots { display: none; }
}

/* ═══════════════════════════════════════════════════════════
   GLOBAL MOBILE — evitar desbordamiento horizontal
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  html, body {
    overflow-x: hidden;
    max-width: 100%;
  }
  main, #main, #wrapper, #content-wrapper {
    overflow-x: hidden;
    max-width: 100%;
    box-sizing: border-box;
  }
}

/* ═══════════════════════════════════════════════════════════
   FOOTER CONTACT BAR (reemplaza newsletter en index.html)
   ═══════════════════════════════════════════════════════════ */
.bb-footer-contact-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .4rem 1.4rem;
  padding: 1.2rem 1.5rem;
  width: 100%;
}
.bb-footer-contact-item {
  font-size: .82rem;
  color: rgba(245,240,232,.75);
  white-space: nowrap;
}
.bb-footer-contact-item i {
  margin-right: .3rem;
  color: #C7B24A;
}
.bb-footer-contact-item a {
  color: rgba(245,240,232,.75);
  text-decoration: none;
  transition: color .2s;
}
.bb-footer-contact-item a:hover { color: #C7B24A; text-decoration: none; }
.bb-footer-contact-sep {
  color: rgba(245,240,232,.25);
  font-size: .75rem;
}
@media (max-width: 560px) {
  .bb-footer-contact-sep { display: none; }
  .bb-footer-contact-bar { gap: .6rem 1rem; }
}

/* ═══════════════════════════════════════════════════════════
   FOOTER COMPLETO  #bb-footer-main
   ═══════════════════════════════════════════════════════════ */

/* Ocultar el footer Elementor antiguo en todas las páginas */
footer#footer .elementor { display: none !important; }
footer#footer {
  background: #051A10 !important;
  padding: 0 !important;
  overflow-x: hidden;
  width: 100%;
  box-sizing: border-box;
}

#bb-footer-main {
  background: #051A10;
  width: 100%;
  box-sizing: border-box;
}
.bb-footer-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 56px 32px 0;
}
.bb-footer-top {
  display: flex;
  gap: 56px;
  padding-bottom: 48px;
  border-bottom: 1px solid rgba(245,240,232,.1);
}
/* Columna de marca */
.bb-footer-brand {
  flex: 0 0 260px;
  min-width: 0;
}
.bb-footer-logo {
  height: 40px;
  width: auto;
  display: block;
  margin-bottom: 6px;
}
.bb-footer-tagline {
  font-size: .62rem;
  letter-spacing: .22em;
  color: rgba(245,240,232,.38);
  margin: 0 0 18px;
  font-weight: 600;
}
.bb-footer-desc {
  font-size: .82rem;
  line-height: 1.68;
  color: rgba(245,240,232,.55);
  margin: 0 0 22px;
}
.bb-footer-social {
  display: flex;
  gap: 9px;
}
.bb-footer-social a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(245,240,232,.08);
  border: 1px solid rgba(245,240,232,.14);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(245,240,232,.7);
  font-size: .88rem;
  text-decoration: none;
  transition: background .2s, color .2s, border-color .2s;
}
.bb-footer-social a:hover {
  background: #C7B24A;
  color: #051A10;
  border-color: #C7B24A;
  text-decoration: none;
}
/* Grid de columnas de navegación */
.bb-footer-nav {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px 20px;
  min-width: 0;
}
.bb-footer-col-title {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1rem;
  font-weight: 600;
  color: #F5F0E8;
  margin: 0 0 16px;
  letter-spacing: .04em;
  text-transform: none;
}
.bb-footer-col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.bb-footer-col ul li {
  margin-bottom: 10px;
  font-size: .83rem;
  color: rgba(245,240,232,.55);
  line-height: 1.45;
}
.bb-footer-col ul li a {
  color: rgba(245,240,232,.55);
  text-decoration: none;
  transition: color .2s;
}
.bb-footer-col ul li a:hover { color: #C7B24A; text-decoration: none; }
.bb-footer-address { font-style: normal; }
/* Barra inferior */
.bb-footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 0 24px;
  font-size: .76rem;
  color: rgba(245,240,232,.28);
}
.bb-footer-cards {
  height: 26px;
  width: auto;
  opacity: .45;
  filter: brightness(0) invert(1);
}
/* Responsive — tablet */
@media (max-width: 960px) {
  .bb-footer-top { flex-direction: column; gap: 32px; }
  .bb-footer-brand { flex: none; max-width: 480px; }
  .bb-footer-nav { grid-template-columns: repeat(2, 1fr); gap: 28px 24px; }
}
/* Responsive — móvil */
@media (max-width: 560px) {
  footer#footer { overflow-x: hidden; }
  #bb-footer-main { width: 100%; box-sizing: border-box; overflow-x: hidden; }
  .bb-footer-inner { padding: 36px 20px 0; }
  .bb-footer-top { gap: 24px; }
  .bb-footer-brand {
    max-width: 100%;
    text-align: center;
  }
  .bb-footer-logo { height: 32px; display: block; margin: 0 auto 6px; }
  .bb-footer-tagline { margin-bottom: 10px; }
  .bb-footer-desc { font-size: .8rem; margin-bottom: 16px; }
  .bb-footer-social { gap: 8px; justify-content: center; }
  .bb-footer-social a { width: 36px; height: 36px; font-size: .85rem; }
  .bb-footer-nav {
    grid-template-columns: 1fr 1fr;
    gap: 20px 16px;
  }
  .bb-footer-col-title { font-size: .88rem; margin-bottom: 10px; }
  .bb-footer-col ul li { font-size: .78rem; margin-bottom: 7px; }
  .bb-footer-bottom {
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
    padding: 18px 0 24px;
    font-size: .72rem;
  }
  .bb-footer-cards { height: 22px; }
}
