/* ═══════════════════════════════════════════════════════
   LA PERLA — TIENDA WEB
   ═══════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════
   LA PERLA — MANUAL DE MARCA · TIENDA WEB
   ───────────────────────────────────────────────────────────────
   Verde principal  : #1C4120  (oscuro, profundo)
   Verde claro      : #26472A  (secundario, ligeramente más claro)
   Verde bajo       : #768C77  (suave, fondos / detalles)
   Marrón           : #633F1B  (cálido, acento tierra)
   Derivados:
     Verde hover    : #152f18  (hover de botones verdes)
     Marrón claro   : #9b6832  (text/icon en tonos café)
     Marrón hover   : #4d3014  (hover de botones marrón)
     Crema          : #f5f0e8  (fondos neutros)
     Oro / borde    : #c9a96e  (detalles dorados)
   ═══════════════════════════════════════════════════════════════ */
:root {
  /* Paleta principal */
  --verde-oscuro:  #1C4120;
  --verde-medio:   #26472A;
  --verde-claro:   #768C77;
  --cafe-oscuro:   #633F1B;
  --cafe-medio:    #9b6832;
  --cafe-claro:    #c4924a;

  /* Hover / states */
  --verde-hover:   #152f18;
  --cafe-hover:    #4d3014;

  /* Fondos y neutros */
  --crema:         #f5f0e8;
  --borde-card:    #c9a96e;
  --texto:         #1a1a1a;
  --gris-suave:    #f8f8f6;
  --verde-soft:    #eef3ee;
  --cafe-soft:     #f5ede5;
}

/* ── GLOBAL ───────────────────────────────────────────── */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { overflow-x: visible; }
body { font-family: 'Inter', sans-serif; color: var(--texto); background: #fff; overflow-x: clip; }
a { text-decoration: none; color: inherit; }

/* ── HEADER ───────────────────────────────────────────── */
.lp-header {
  position: sticky;
  top: 0;
  z-index: 900;
  background: #fff;
  border-bottom: 1.5px solid rgba(28,65,32,.12);
  padding: 0 2.5rem;
  height: 92px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1rem;
  overflow: visible;
}

/* Logo */
.lp-logo {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 2.35rem;
  font-weight: 700;
  color: var(--verde-oscuro);
  letter-spacing: .03em;
  white-space: nowrap;
  line-height: 1;
  display: flex;
  align-items: center;
  gap: .25rem;
  justify-self: center;
  padding-right: 1.5rem;
}
.lp-logo span { font-style: italic; font-weight: 400; }
.lp-logo-img { max-height: 64px; width: auto; display: block; object-fit: contain; }

/* Nav centro */
.lp-header nav {
  display: flex;
  justify-content: center;
  justify-self: center;
}
.lp-nav {
  display: flex;
  align-items: center;
  gap: 2.8rem;
  list-style: none;
}
.lp-nav li a {
  display: flex;
  align-items: center;
  gap: .35rem;
  font-size: .82rem;
  font-weight: 600;
  letter-spacing: .07em;
  color: var(--verde-oscuro);
  text-transform: uppercase;
  transition: color .2s;
}
.lp-nav > li > a:hover,
.lp-nav > li > a.active { color: var(--cafe-oscuro); }
.lp-nav li a svg { width: 17px; height: 17px; }
/* Chevron del item TIENDA */
.lp-nav-chevron {
  width: 12px !important; height: 12px !important;
  transition: transform .25s;
  flex-shrink: 0;
}
.lp-nav-has-mega:hover .lp-nav-chevron { transform: rotate(180deg); }

/* ── Mega menú TIENDA ─────────────────────────────────── */
.lp-nav-has-mega { position: relative; }
.lp-mega {
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  transform: translateX(-50%) translateY(-6px);
  width: 700px;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 20px 60px rgba(0,0,0,.14), 0 4px 16px rgba(0,0,0,.08);
  display: flex;
  gap: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease, visibility .22s;
  z-index: 1000;
  overflow: hidden;
}
.lp-nav-has-mega:hover .lp-mega,
.lp-mega:hover {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
/* Puente invisible para no perder el hover al bajar el cursor */
.lp-nav-has-mega::after {
  content: '';
  position: absolute;
  top: 100%;
  left: -20px;
  right: -20px;
  height: 18px;
}

/* Columna izquierda: categorías */
.lp-mega-cats {
  flex: 0 0 200px;
  background: var(--verde-oscuro, #1C4120);
  padding: 1.4rem 0;
}
.lp-mega-cats-title {
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.5);
  padding: 0 1.2rem .75rem;
}
.lp-mega-cat-link {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .48rem 1.2rem;
  font-size: .78rem;
  font-weight: 600;
  color: rgba(255,255,255,.82) !important;
  letter-spacing: .04em;
  text-transform: none !important;
  transition: background .15s, color .15s !important;
  text-decoration: none;
}
.lp-mega-cat-link:hover,
.lp-mega-cat-link.active {
  background: rgba(255,255,255,.15);
  color: #fff !important;
}
.lp-mega-cat-link.active {
  border-left: 3px solid var(--cafe-claro, #c4924a);
  padding-left: calc(1.2rem - 3px);
}
.lp-mega-cat-img {
  width: 28px; height: 28px;
  border-radius: 6px;
  object-fit: cover;
  flex-shrink: 0;
  opacity: .85;
}
.lp-mega-cat-link:hover .lp-mega-cat-img { opacity: 1; }

/* Columna derecha: productos destacados */
.lp-mega-prods {
  flex: 1;
  padding: 1.1rem 1.2rem 1rem;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.lp-mega-prods-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .75rem;
}
.lp-mega-prods-title {
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #9ca3af;
}
.lp-mega-grid {
  display: none;
  grid-template-columns: repeat(4, 1fr);
  gap: .55rem;
  flex: 1;
}
.lp-mega-grid.active { display: grid; }
.lp-mega-empty {
  font-size: .78rem;
  color: #9ca3af;
  padding: 1rem 0;
  grid-column: 1 / -1;
}
.lp-mega-prod {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  text-decoration: none;
  border-radius: 12px;
  padding: .5rem .4rem;
  transition: background .18s, transform .18s;
}
.lp-mega-prod:hover {
  background: #f3f4f6;
  transform: translateY(-2px);
}
.lp-mega-prod-img {
  width: 68px; height: 68px;
  border-radius: 10px;
  overflow: hidden;
  background: #f9f9f9;
  margin-bottom: .4rem;
  flex-shrink: 0;
}
.lp-mega-prod-img img {
  width: 100%; height: 100%;
  object-fit: cover;
}
.lp-mega-prod-name {
  font-size: .7rem;
  font-weight: 600;
  color: var(--verde-oscuro);
  line-height: 1.25;
  margin-bottom: .2rem;
}
.lp-mega-prod-price {
  font-size: .72rem;
  font-weight: 700;
  color: var(--cafe-oscuro);
}
.lp-mega-ver-todo {
  font-size: .75rem;
  font-weight: 700;
  color: var(--cafe-oscuro);
  text-decoration: none;
  letter-spacing: .05em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: .3rem;
  transition: color .18s;
}
.lp-mega-ver-todo:hover { color: var(--verde-oscuro); }

/* Buscador inline */
.lp-search-btn {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--verde-oscuro);
  padding: 4px;
  display: flex;
  align-items: center;
  transition: color .2s;
}
.lp-search-btn:hover { color: var(--cafe-oscuro); }

/* ── BUSCADOR OVERLAY AJAX ────────────────────────────── */
.lp-search-overlay {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: rgba(10,20,12,.72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s, visibility .25s;
  padding: 5rem 1rem 2rem;
  overflow-y: auto;
}
.lp-search-overlay.active {
  opacity: 1;
  visibility: visible;
}
.lp-search-box {
  width: 100%;
  max-width: 660px;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 30px 80px rgba(0,0,0,.28);
  overflow: hidden;
  transform: translateY(-18px);
  transition: transform .28s cubic-bezier(.34,1.56,.64,1);
  flex-shrink: 0;
}
.lp-search-overlay.active .lp-search-box { transform: translateY(0); }

/* Input row */
.lp-search-input-row {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1rem 1.25rem;
  border-bottom: 1.5px solid #f3f4f6;
}
.lp-search-input-row svg { color: #9ca3af; flex-shrink: 0; }
.lp-search-input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 1.1rem;
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  color: #111;
  background: transparent;
}
.lp-search-input::placeholder { color: #c0c4cc; font-weight: 400; }
.lp-search-close {
  background: #f3f4f6;
  border: none;
  border-radius: 8px;
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  color: #6b7280;
  transition: background .15s, color .15s;
  flex-shrink: 0;
}
.lp-search-close:hover { background: #e5e7eb; color: #111; }

/* Estado vacío / inicial */
.lp-search-hint {
  padding: 1.4rem 1.25rem;
  font-size: .83rem;
  color: #9ca3af;
  text-align: center;
}
.lp-search-hint strong { color: var(--verde-oscuro); }

/* Body contenedor resultados */
.lp-search-body {
  padding: 0;
}

/* Resultados */
.lp-search-count {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #9ca3af;
  margin: 0;
  padding: .75rem 1.25rem .4rem;
}
.lp-search-count strong { color: var(--verde-oscuro); text-transform: none; letter-spacing: 0; }
.lp-search-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .6rem;
  padding: 0 1rem 1rem;
}
.lp-search-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  border-radius: 14px;
  overflow: hidden;
  border: 1.5px solid #f3f4f6;
  transition: border-color .18s, transform .18s, box-shadow .18s;
  background: #fff;
}
.lp-search-card:hover {
  border-color: var(--cafe-claro);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,.10);
}
.lp-search-card-img {
  width: 100%;
  aspect-ratio: 1;
  background: #f9f9f9;
  overflow: hidden;
}
.lp-search-card-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .3s;
}
.lp-search-card:hover .lp-search-card-img img { transform: scale(1.06); }
.lp-search-card-noimg,
.lp-search-card-img--empty {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  color: #d1d5db;
  background: #f3f4f6;
}
.lp-search-card-info {
  padding: .55rem .6rem .65rem;
  display: flex;
  flex-direction: column;
  gap: .2rem;
}
.lp-search-card-cat {
  display: inline-block;
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--cafe-medio, #9b6832);
  background: #fdf3e7;
  border-radius: 4px;
  padding: .1rem .35rem;
  align-self: flex-start;
}
.lp-search-card-name {
  font-size: .75rem;
  font-weight: 600;
  color: var(--verde-oscuro);
  line-height: 1.25;
  margin: 0;
}
.lp-search-card-prices {
  display: flex;
  align-items: baseline;
  gap: .3rem;
  margin-top: .1rem;
}
.lp-search-card-price { font-size: .82rem; font-weight: 800; color: var(--cafe-oscuro); }
.lp-search-card-price-old { font-size: .68rem; font-weight: 500; color: #9ca3af; text-decoration: line-through; }

/* Spinner */
.lp-search-spinner {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  gap: .6rem;
  color: #9ca3af;
  font-size: .82rem;
}
.lp-search-spinner::before {
  content: '';
  width: 18px; height: 18px;
  border: 2px solid #e5e7eb;
  border-top-color: var(--verde-oscuro);
  border-radius: 50%;
  animation: lp-spin .6s linear infinite;
}
@keyframes lp-spin { to { transform: rotate(360deg); } }

/* Sin resultados */
.lp-search-empty {
  text-align: center;
  padding: 2rem 1.25rem;
  color: #6b7280;
  font-size: .88rem;
}
.lp-search-empty strong { color: var(--verde-oscuro); display: block; font-size: 1rem; margin-bottom: .3rem; }
@media (max-width: 540px) {
  .lp-search-overlay { padding: 3rem .5rem 1rem; }
  .lp-search-grid { grid-template-columns: repeat(2, 1fr); padding: 0 .75rem .75rem; }
}

/* Acciones derecha */
.lp-actions {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  justify-self: end;
}
.lp-whatsapp {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .78rem;
  line-height: 1.2;
  color: var(--verde-oscuro);
}
.lp-whatsapp svg { width: 22px; height: 22px; color: #25D366; }
.lp-whatsapp small { display: block; font-size: .68rem; color: #888; font-weight: 400; }
.lp-whatsapp strong { font-size: .82rem; font-weight: 700; }

.lp-login {
  display: flex;
  align-items: center;
  gap: .35rem;
  font-size: .78rem;
  color: var(--verde-oscuro);
  line-height: 1.2;
}
.lp-login svg { width: 22px; height: 22px; }
.lp-login small { font-size: .68rem; color: #888; }
.lp-login strong { font-size: .82rem; font-weight: 700; }

.lp-cart {
  display: flex;
  align-items: center;
  gap: .5rem;
  background: var(--verde-oscuro);
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: .45rem .9rem;
  font-size: .88rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s;
  white-space: nowrap;
}
.lp-cart:hover { background: var(--verde-hover); }
.lp-cart svg { width: 20px; height: 20px; }
.lp-cart-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--cafe-oscuro);
  color: #fff;
  font-size: .65rem;
  font-weight: 700;
  min-width: 18px;
  height: 18px;
  border-radius: 50%;
  padding: 0 3px;
  margin-left: -4px;
}

/* ── HERO CAROUSEL ────────────────────────────────────── */
.lp-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: var(--verde-oscuro);
}

.lp-hero-slide {
  display: none;
  width: 100%;
  min-height: 420px;
  position: relative;
  overflow: hidden;
}
.lp-hero-slide.active { display: flex; align-items: center; }

.lp-hero-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform .7s ease;
  overflow: hidden;
}
.lp-hero-picture {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}
.lp-hero-picture-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* Gradiente izquierda → transparente para legibilidad de texto */
.lp-hero-slide::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to right,
    rgba(0, 0, 0, 0.52) 0%,
    rgba(0, 0, 0, 0.28) 50%,
    rgba(0, 0, 0, 0.06) 100%
  );
  pointer-events: none;
}
/* Slide sin texto: sin gradiente, imagen al 100% */
.lp-hero-slide--clean::before { display: none; }
/* Slide con clic directo (etiqueta <a>) */
a.lp-hero-slide--link { display: none; text-decoration: none; cursor: pointer; }
a.lp-hero-slide--link.active { display: flex; align-items: center; }
a.lp-hero-slide--link .lp-hero-bg { transition: transform .4s ease; }
a.lp-hero-slide--link:hover .lp-hero-bg { transform: scale(1.025); }
/* Slides DB: tipografía Inter de marca (misma que secciones Packs / Chocolatería) */
.lp-hero-slide--db .lp-hero-title {
  font-family: 'Inter', sans-serif;
  font-size: 3rem;
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -.02em;
  color: #fff;
  text-shadow: 0 2px 16px rgba(0,0,0,.60);
}
.lp-hero-slide--db .lp-hero-subtitle {
  font-family: 'Inter', sans-serif;
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--cafe-claro, #c4924a);
  text-shadow: none;
  margin-top: .55rem;
  margin-bottom: 0;
}

/* Banner jalador: solo imagen, sin overlay de texto */
.lp-banner--imagen { padding: 0; min-height: 0; }
.lp-banner-img-full {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 16px;
  object-fit: fill;
  transition: transform .55s cubic-bezier(.25,.8,.25,1);
}
.lp-banner--imagen:hover .lp-banner-img-full {
  transform: scale(1.04);
}

.lp-hero-content {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 2.5rem 5rem;
  gap: 2rem;
}

.lp-hero-text { flex: 1; color: #fff; }

.lp-hero-badge {
  display: inline-block;
  background: var(--cafe-medio);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .2rem .7rem;
  border-radius: 4px;
  margin-bottom: .6rem;
}

.lp-hero-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: .3rem;
  text-shadow: 0 2px 14px rgba(0,0,0,.65);
}
.lp-hero-title em {
  font-style: italic;
  font-size: 3rem;
  display: block;
}
.lp-hero-brand {
  font-size: 1.2rem;
  letter-spacing: .25em;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 1rem;
}

.lp-hero-promo {
  display: flex;
  align-items: baseline;
  gap: .4rem;
  margin-bottom: .5rem;
}
.lp-hero-promo .big { font-size: 4.5rem; font-weight: 900; line-height: 1; }
.lp-hero-promo .pct { font-size: 2.2rem; font-weight: 900; }
.lp-hero-promo .dto { font-size: 1.6rem; font-weight: 700; color: #f0d080; }

.lp-hero-subtitle {
  font-size: 1.05rem;
  color: rgba(255, 255, 255, .88);
  margin-top: .5rem;
  margin-bottom: 0;
  line-height: 1.55;
  text-shadow: 0 1px 10px rgba(0,0,0,.6);
}

.lp-hero-detail {
  font-size: .95rem;
  color: #ddd;
  margin-bottom: 1.5rem;
  text-shadow: 0 1px 8px rgba(0,0,0,.55);
}
.lp-hero-detail strong { color: #fff; }

/* ── CTA del hero ───────────────────────────────────────── */
.lp-hero-cta {
  margin-top: 1.6rem;
  display: flex;
  gap: .75rem;
  flex-wrap: wrap;
  align-items: center;
}

.lp-btn-hero {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .7rem 2rem;
  background: var(--cafe-oscuro, #5C3317);
  color: #fff;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 7px;
  border: 2px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  transition:
    transform .22s cubic-bezier(.34, 1.56, .64, 1),
    box-shadow .22s ease,
    filter    .22s ease;
}
.lp-btn-hero:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 8px 22px rgba(0,0,0,.30);
  filter: brightness(1.12);
  color: #fff;
  text-decoration: none;
}
.lp-btn-hero:active {
  transform: translateY(-1px) scale(1.01);
  box-shadow: 0 3px 10px rgba(0,0,0,.2);
}

.lp-btn-hero-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .7rem 2rem;
  background: transparent;
  color: #fff;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 7px;
  border: 2px solid rgba(255,255,255,.75);
  cursor: pointer;
  white-space: nowrap;
  transition:
    transform .22s cubic-bezier(.34, 1.56, .64, 1),
    box-shadow .22s ease,
    background .2s ease;
}
.lp-btn-hero-ghost:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 8px 22px rgba(0,0,0,.22);
  background: rgba(255,255,255,.12);
  color: #fff;
  text-decoration: none;
}
.lp-btn-hero-ghost:active {
  transform: translateY(-1px) scale(1.01);
}

.lp-btn-comprar {
  display: inline-block;
  background: var(--cafe-oscuro);
  color: #fff;
  font-size: .88rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .7rem 2rem;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  transition: background .2s;
}
.lp-btn-comprar:hover { background: var(--cafe-hover); color: #fff; }

/* Imagen del producto en hero */
.lp-hero-img {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-end;
  gap: 1.5rem;
}
.lp-hero-img img {
  max-height: 320px;
  object-fit: contain;
  filter: drop-shadow(0 8px 24px rgba(0,0,0,.5));
}

/* Precio destacado hero */
.lp-hero-price {
  text-align: center;
  color: #fff;
  border-left: 2px solid rgba(255,255,255,.3);
  padding-left: 1.5rem;
  align-self: center;
}
.lp-hero-price .currency { font-size: 1rem; font-weight: 700; }
.lp-hero-price .amount   { font-size: 4rem; font-weight: 900; line-height: 1; }
.lp-hero-price .label    { font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: #ccc; font-weight: 600; }

/* Flechas hero */
.lp-hero-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  background: rgba(255,255,255,.9);
  border: none;
  border-radius: 50%;
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .2s;
  color: var(--verde-oscuro);
}
.lp-hero-arrow:hover { background: #fff; }
.lp-hero-arrow.prev { left: 1.5rem; }
.lp-hero-arrow.next { right: 1.5rem; }
.lp-hero-arrow svg  { width: 20px; height: 20px; }

/* Dots del hero */
.lp-hero-dots {
  position: absolute;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 10;
}
.lp-hero-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: rgba(255,255,255,.4);
  border: 1.5px solid rgba(255,255,255,.7);
  cursor: pointer;
  transition: background .25s, transform .25s;
  padding: 0;
}
.lp-hero-dot.active {
  background: #fff;
  transform: scale(1.25);
}

/* ── CATEGORÍAS CAROUSEL ──────────────────────────────── */
/* ── CATEGORÍAS ─────────────────────────────────────────── */
.lp-cats {
  padding: 3rem 0 3rem;
  background: #fff;
}

.lp-cats-inner {
  max-width: 1100px;
  margin: 0 auto;
  position: relative;
  padding: 0 3rem;    /* espacio para las flechas a cada lado */
}

.lp-cats-track-wrap {
  overflow: hidden;
  padding-top: 6px;         /* espacio para el translateY(-3px) del hover */
  padding-bottom: 1.5rem;   /* espacio para los pill labels */
  margin-top: -6px;         /* compensa el padding-top visualmente */
}

.lp-cats-track {
  display: flex;
  gap: 2.8rem;
  transition: transform .35s ease;
}

.lp-cat-card {
  flex: 0 0 auto;
  background: #fff;
  border: 1.5px solid #b8966a;
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  text-decoration: none;
  transition: box-shadow .2s, transform .2s;
  position: relative;
}
.lp-cat-card:hover {
  box-shadow: 0 6px 20px rgba(92,51,23,.18);
  transform: translateY(-3px);
}

.lp-cat-icon {
  flex: 1;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem 1rem 1.4rem;
}
.lp-cat-icon img, .lp-cat-img { width: 82px; height: 82px; object-fit: contain; display: block; }
.lp-cat-icon svg { width: 82px; height: 82px; }

.lp-cat-label {
  position: absolute;
  bottom: -0.88rem;
  left: 50%;
  transform: translateX(-50%);
  background: #5c3317;
  color: #fff;
  font-size: .70rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  text-align: center;
  padding: .4rem 1.2rem;
  border-radius: 999px;
  white-space: nowrap;
  z-index: 2;
}

/* Flechas */
.lp-cats-arrow {
  position: absolute;
  top: 40%;
  transform: translateY(-50%);
  background: #5c3317;
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 5;
  transition: background .2s;
}
.lp-cats-arrow:hover { background: #7a4520; }
.lp-cats-arrow.prev { left: 0; }
.lp-cats-arrow.next { right: 0; }

/* Dots */
.lp-dots {
  display: flex;
  justify-content: center;
  gap: .5rem;
  padding: 1.8rem 0 0;
}
.lp-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(92,51,23,.2);
  border: none;
  cursor: pointer;
  transition: background .2s;
  padding: 0;
}
.lp-dot.active { background: #5c3317; }

/* ── BANNERS PROMO ────────────────────────────────────── */
.lp-banners {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.2rem;
  padding: 1rem 8rem 2.5rem;
}

.lp-banner {
  border-radius: 16px;
  overflow: hidden;
  position: relative;
  min-height: 30px;
  display: flex;
  align-items: center;
  padding: 1.5rem 2rem;
  cursor: pointer;
  transition: transform .4s cubic-bezier(.25,.8,.25,1),
              box-shadow .4s cubic-bezier(.25,.8,.25,1);
}
.lp-banner:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 45px rgba(0,0,0,.28);
}

/* Destello (shine) que barre el banner en hover */
.lp-banner::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    110deg,
    transparent 30%,
    rgba(255,255,255,.22) 50%,
    transparent 70%
  );
  transform: translateX(-120%);
  transition: transform .65s ease;
  pointer-events: none;
  z-index: 4;
}
.lp-banner:hover::after {
  transform: translateX(120%);
}

.lp-banner-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform .55s cubic-bezier(.25,.8,.25,1);
}
.lp-banner:hover .lp-banner-bg { transform: scale(1.06); }

.lp-banner-overlay {
  position: absolute;
  inset: 0;
}

.lp-banner-text {
  position: relative;
  z-index: 2;
  color: #fff;
}

/* Banner café (marrón) */
.lp-banner-cafe .lp-banner-overlay {
  background: linear-gradient(90deg, rgba(92,51,23,.92) 55%, rgba(92,51,23,.5) 100%);
}

/* Banner verde */
.lp-banner-verde .lp-banner-overlay {
  background: linear-gradient(90deg, rgba(26,58,40,.92) 55%, rgba(26,58,40,.5) 100%);
}

.lp-banner-tag {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  background: rgba(255,255,255,.2);
  padding: .15rem .5rem;
  border-radius: 4px;
  display: inline-block;
  margin-bottom: .4rem;
}

.lp-banner-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.6rem;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}
.lp-banner-title em {
  font-size: 1.9rem;
  display: block;
  font-style: italic;
  text-transform: none;
}

.lp-banner-subtitle {
  font-size: .82rem;
  color: rgba(255,255,255,.85);
  margin-top: .3rem;
}

.lp-banner-ribbon {
  position: absolute;
  bottom: 1rem;
  left: 1.8rem;
  background: var(--cafe-oscuro);
  color: #fff;
  font-size: .7rem;
  font-weight: 800;
  padding: .2rem .6rem;
  border-radius: 4px;
  letter-spacing: .05em;
  transform: rotate(-3deg);
}

/* ── RESPONSIVE ───────────────────────────────────────── */
/* ── TARJETAS DESTACADAS ──────────────────────────────── */
.lp-feature-cards {
  background: #ECF1EB;
  padding: 4rem 2rem;
}
.lp-fc-inner {
  max-width: 1050px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}
.lp-fc-card {
  display: flex;
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 24px rgba(0,0,0,.08);
  transition: transform .35s cubic-bezier(.25,.8,.25,1), box-shadow .35s;
}
.lp-fc-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 14px 36px rgba(0,0,0,.14);
}
.lp-fc-left {
  flex: 0 0 42%;
  min-height: 240px;
  position: relative;
  overflow: hidden;
}
.lp-fc-verde .lp-fc-left { background: #f5f0e8; }
.lp-fc-cafe  .lp-fc-left { background: #f5f0e8; }
.lp-fc-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.lp-fc-body {
  flex: 1;
  padding: 2rem 1.8rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .5rem;
}
.lp-fc-eyebrow {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--cafe-claro);
}
.lp-fc-titulo {
  font-family: 'Inter', sans-serif;
  font-weight: 800;
  font-size: 1.45rem;
  line-height: 1.25;
  color: var(--cafe-oscuro);
  margin: 0;
}
.lp-fc-verde .lp-fc-titulo { color: var(--verde-oscuro); }
.lp-fc-desc {
  font-size: .88rem;
  color: #666;
  line-height: 1.6;
  margin: .25rem 0 .75rem;
}
.lp-fc-btn {
  display: inline-block;
  align-self: flex-start;
  padding: .6rem 1.6rem;
  border-radius: 50px;
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background .25s, transform .2s;
}
.lp-fc-btn--verde {
  background: var(--verde-oscuro);
  color: #fff;
}
.lp-fc-btn--verde:hover {
  background: var(--verde-hover);
  transform: translateY(-2px);
  color: #fff;
}
.lp-fc-btn--cafe {
  background: var(--cafe-oscuro);
  color: #fff;
}
.lp-fc-btn--cafe:hover {
  background: var(--cafe-hover);
  transform: translateY(-2px);
  color: #fff;
}
@media (max-width: 768px) {
  .lp-fc-inner { grid-template-columns: 1fr; }
  .lp-fc-card  { flex-direction: column; }
  .lp-fc-left  { flex: none; min-height: 180px; }
}

/* ── SOMOS LA PERLA ───────────────────────────────────── */
.lp-somos {
  background: var(--verde-soft);
  padding: 5rem 2rem;
}
.lp-somos-inner {
  max-width: 1050px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}
.lp-somos-label {
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--verde-oscuro);
  margin-bottom: .6rem;
}
.lp-somos-title {
  font-family: 'Inter', sans-serif;
  font-size: 2.6rem;
  font-weight: 800;
  color: var(--verde-oscuro);
  line-height: 1.1;
  margin-bottom: 1.2rem;
  letter-spacing: -.01em;
}
.lp-somos-body {
  font-size: .9rem;
  color: var(--texto);
  line-height: 1.75;
  margin-bottom: 2rem;
  max-width: 480px;
  opacity: .75;
}
.lp-btn-contacto {
  display: inline-block;
  background: var(--cafe-oscuro);
  color: #fff;
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .85rem 2.2rem;
  border-radius: 30px;
  border: none;
  cursor: pointer;
  transition: background .2s;
}
.lp-btn-contacto:hover { background: var(--cafe-hover); color: #fff; }

/* Collage fotos */
@keyframes lp-float {
  0%, 100% { transform: translateY(0px);    }
  50%       { transform: translateY(-14px); }
}

.lp-somos-collage {
  animation: lp-float 5s ease-in-out infinite;
  will-change: transform;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.lp-collage-deco-verde {
  position: absolute;
  top: 0; right: 0;
  width: 130px; height: 110px;
  background: var(--verde-oscuro);
  border-radius: 18px;
  z-index: 0;
}
.lp-collage-deco-cafe {
  position: absolute;
  bottom: 0; right: 30px;
  width: 90px; height: 80px;
  background: var(--cafe-oscuro);
  border-radius: 14px;
  z-index: 0;
}
.lp-collage-icon {
  position: absolute;
  left: 145px; top: 185px;
  width: 72px; height: 72px;
  background: var(--cafe-medio);
  border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  z-index: 4;
  box-shadow: 0 4px 16px rgba(0,0,0,.25);
}
.lp-collage-icon svg { width: 38px; height: 38px; color: #fff; }

.lp-collage-img {
  position: absolute;
  border-radius: 20px;
  object-fit: cover;
  background: #ccc;
  border: 3px solid #fff;
  box-shadow: 0 6px 24px rgba(0,0,0,.18);
}
.lp-collage-img-1 { width: 230px; height: 270px; top: 20px; left: 0; z-index: 2; }
.lp-collage-img-2 { width: 210px; height: 230px; bottom: 10px; left: 40px; z-index: 3; }
.lp-collage-img-3 { width: 215px; height: 390px; top: 10px; right: 20px; z-index: 1; }

/* fallback color cuando no hay imagen */
.lp-collage-img-1 { background: linear-gradient(135deg,#26472A,#1C4120); }
.lp-collage-img-2 { background: linear-gradient(135deg,#2e5233,#26472A); }
.lp-collage-img-3 { background: linear-gradient(135deg,#1C4120,#0f2d14); }

/* ── SECCIÓN PRODUCTOS (granos / cacao) ───────────────── */
.lp-prods-section {
  padding: 4rem 2rem;
  position: relative;
  overflow: hidden;
}
.lp-prods-inner {
  max-width: 1050px;
  margin: 0 auto;
}
.lp-prods-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cellipse cx='40' cy='40' rx='18' ry='26' fill='none' stroke='%231a3a28' stroke-width='1.2' opacity='0.07' transform='rotate(-25 40 40)'/%3E%3Cpath d='M40 16 Q52 40 40 64' stroke='%231a3a28' stroke-width='1' fill='none' opacity='0.07' transform='rotate(-25 40 40)'/%3E%3C/svg%3E");
  background-size: 80px 80px;
  pointer-events: none;
}
.lp-prods-section-title {
  text-align: center;
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 2.5rem;
  position: relative;
}
.lp-prods-section-title.verde { color: var(--verde-oscuro); }
.lp-prods-section-title.cafe  { color: var(--cafe-oscuro); }

.lp-prods-carousel { position: relative; }
.lp-prods-track-wrap { overflow: hidden; }
.lp-prods-track {
  display: flex;
  gap: 1.2rem;
  transition: transform .35s ease;
}

/* Tarjeta de producto */
.lp-prod-card {
  flex: 0 0 calc(25% - 1rem);
  min-width: 220px;
  background: #fff;
  border-radius: 20px;
  padding: 0;
  box-shadow: 0 2px 16px rgba(0,0,0,.08);
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  transition: transform .25s, box-shadow .25s;
}
.lp-prod-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(0,0,0,.13);
}

/* Badge posicionado sobre la imagen */
.lp-prod-badge {
  position: absolute;
  top: .65rem;
  right: .65rem;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: .3rem;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(3px);
  padding: .22rem .5rem .22rem .45rem;
  border-radius: 20px;
  box-shadow: 0 1px 6px rgba(0,0,0,.12);
}
.lp-prod-badge-label {
  font-size: .68rem;
  color: #777;
  font-weight: 500;
}
.lp-prod-badge-score {
  background: var(--verde-oscuro);
  color: #fff;
  font-size: .68rem;
  font-weight: 700;
  width: 22px; height: 22px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.lp-prod-badge-score.cafe { background: var(--cafe-oscuro); }

/* Cuerpo de la tarjeta */
.lp-prod-body {
  padding: .85rem 1rem 1rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.lp-prod-weight {
  font-size: .72rem;
  font-weight: 600;
  margin-bottom: .25rem;
  opacity: .7;
}
.lp-prod-weight.verde { color: var(--verde-oscuro); }
.lp-prod-weight.cafe  { color: var(--cafe-oscuro); }

.lp-prod-name {
  font-size: .95rem;
  font-weight: 700;
  color: var(--texto);
  margin-bottom: .5rem;
  line-height: 1.3;
}
.lp-prod-price {
  font-size: .95rem;
  color: var(--texto);
  font-weight: 700;
  margin-bottom: .55rem;
  display: flex;
  align-items: baseline;
  gap: .4rem;
}
.lp-price-old {
  text-decoration: line-through;
  opacity: .45;
  font-size: .82rem;
  font-weight: 500;
}
.lp-price-new { color: var(--cafe-oscuro); }

.lp-prod-delivery {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  margin-bottom: .85rem;
  font-size: .73rem;
  color: #999;
  line-height: 1;
}
.lp-prod-delivery span {
  display: flex;
  align-items: center;
  gap: .35rem;
}
.lp-prod-delivery svg { flex-shrink: 0; }

.lp-btn-carrito {
  width: 100%;
  padding: .65rem;
  border: none;
  border-radius: 10px;
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
  transition: opacity .2s;
  color: #fff;
  background: var(--verde-oscuro);
  margin-top: auto;
  letter-spacing: .03em;
}
.lp-btn-carrito:hover { opacity: .88; }
.lp-btn-carrito.verde { background: var(--verde-oscuro); }
.lp-btn-carrito.cafe  { background: var(--cafe-oscuro); }

/* Dots comunes */
.lp-prods-dots {
  display: flex;
  justify-content: center;
  gap: .5rem;
  margin-top: 1.5rem;
}

/* ── TARJETAS INFO (2 col) ────────────────────────────── */
.lp-info-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.2rem;
  padding: 2rem 3rem 3rem;
  background: var(--verde-soft);
}
.lp-info-card {
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
  box-shadow: 0 2px 16px rgba(0,0,0,.06);
}
.lp-info-card-img {
  width: 100%;
  height: 100%;
  min-height: 260px;
  object-fit: cover;
  background: linear-gradient(135deg, #c9a96e, #633F1B);
}
.lp-info-card-body {
  padding: 2rem 1.8rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .8rem;
}
.lp-info-card-title {
  font-family: 'Playfair Display', serif;
  font-size: 1.45rem;
  font-weight: 700;
  color: var(--verde-oscuro);
  line-height: 1.25;
}
.lp-info-card-body p {
  font-size: .82rem;
  color: var(--texto);
  opacity: .7;
  line-height: 1.65;
}
.lp-btn-comprar-sm {
  display: inline-block;
  background: var(--cafe-oscuro);
  color: #fff;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .65rem 1.8rem;
  border-radius: 30px;
  border: none;
  cursor: pointer;
  align-self: flex-start;
  transition: background .2s;
}
.lp-btn-comprar-sm:hover { background: var(--cafe-hover); color: #fff; }

/* ── PACK SELECCIÓN ───────────────────────────────────── */
.lp-packs {
  background: url('../img/pack/fondo-pack.jpg') center/cover no-repeat;
  padding: 4.5rem 3rem;
  position: relative;
}
.lp-packs::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, rgba(154,102,47,.38) 0%, rgba(99,63,27,.42) 35%, rgba(28,65,32,.48) 65%, rgba(15,45,20,.55) 100%);
  pointer-events: none;
}
.lp-packs-header,
.lp-packs-carousel,
.lp-packs-dots { position: relative; z-index: 1; }

/* arriba-izq: solo baja (se queda pegado al filo izquierdo) */
@keyframes lp-bean-nudge-1 {
  0%, 100% { transform: translateY(0);    }
  50%       { transform: translateY(4px); }
}
/* arriba-der: solo baja (se queda pegado al filo derecho) */
@keyframes lp-bean-nudge-3 {
  0%, 100% { transform: translateY(0);    }
  50%       { transform: translateY(4px); }
}
/* abajo-izq: sube suave (pegado al filo izquierdo) */
@keyframes lp-bean-float-2 {
  0%, 100% { transform: translateY(0);     }
  50%       { transform: translateY(-10px); }
}
/* abajo-der: sube suave (pegado al filo derecho) */
@keyframes lp-bean-float-4 {
  0%, 100% { transform: translateY(0);    }
  50%       { transform: translateY(-9px); }
}

.lp-packs-bean {
  position: absolute;
  width: 120px;
  pointer-events: none;
  z-index: 2;
  opacity: .90;
  will-change: transform;
}
.lp-packs-bean-izq-arr { top: 0;    left:  0; animation: lp-bean-nudge-1 6.0s ease-in-out infinite; }
.lp-packs-bean-izq-baj { bottom: 0; left:  0; animation: lp-bean-float-2 5.8s ease-in-out infinite; }
.lp-packs-bean-der-arr { top: 0;    right: 0; animation: lp-bean-nudge-3 6.4s ease-in-out infinite; }
.lp-packs-bean-der-baj { bottom: 0; right: 0; animation: lp-bean-float-4 6.2s ease-in-out infinite; }

.lp-packs-header {
  text-align: center;
  margin-bottom: 2.5rem;
}
.lp-packs-eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--cafe-claro);
  margin-bottom: .4rem;
}
.lp-packs-title {
  font-family: 'Inter', sans-serif;
  font-size: 2.6rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.1;
  letter-spacing: -.01em;
}
.lp-packs-title em { font-style: normal; }
.lp-packs-sub {
  color: rgba(255,255,255,.65);
  font-size: .85rem;
  margin-top: .5rem;
}

.lp-packs-carousel {
  display: flex;
  align-items: center;
  gap: 1rem;
  max-width: 1200px;
  margin: 0 auto;
}
.lp-packs-track-wrap { overflow: hidden; flex: 1; }
.lp-packs-track {
  display: flex;
  gap: 1.2rem;
  transition: transform .35s ease;
}
.lp-packs-arrow {
  flex-shrink: 0;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.3);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background .2s;
}
.lp-packs-arrow:hover { background: rgba(255,255,255,.3); }
.lp-packs-arrow svg { width: 18px; height: 18px; }

/* Tarjeta pack */
.lp-pack-card {
  flex: 0 0 calc(25% - 1rem);
  min-width: 220px;
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 20px rgba(0,0,0,.25);
  transition: transform .25s, box-shadow .25s;
}
.lp-pack-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(0,0,0,.30);
}
.lp-pack-img-wrap {
  width: 100%;
  height: 195px;
  overflow: hidden;
  background: linear-gradient(135deg, #c4924a 0%, #26472A 100%);
}
.lp-pack-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.lp-pack-card-body {
  padding: 1rem 1rem .9rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.lp-pack-label {
  font-size: .7rem;
  font-weight: 700;
  color: var(--cafe-medio);
  margin-bottom: .25rem;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.lp-pack-name {
  font-size: .9rem;
  font-weight: 700;
  color: var(--texto);
  line-height: 1.3;
  margin-bottom: .4rem;
}
.lp-pack-desc {
  font-size: .75rem;
  color: #888;
  line-height: 1.5;
  margin-bottom: .8rem;
  flex: 1;
  /* 2 líneas visibles + desvanecido */
  max-height: calc(1.5em * 4);
  overflow: hidden;
  position: relative;
}
.lp-pack-desc::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  bottom: 0;
  height: calc(1.5em * 2.5);
  background: linear-gradient(to bottom, transparent, #fff);
  pointer-events: none;
}
.lp-pack-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
}
.lp-pack-price {
  font-size: 1.15rem;
  font-weight: 900;
  color: var(--texto);
}
.lp-pack-add {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--cafe-oscuro);
  color: #fff;
  border: none;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background .2s;
}
.lp-pack-add:hover { background: var(--cafe-hover); }

.lp-packs-dots { display: flex; justify-content: center; gap: .5rem; margin-top: 1.5rem; }
.lp-packs-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,.35);
  border: none;
  cursor: pointer;
  padding: 0;
  transition: background .2s, transform .2s;
}
.lp-packs-dot.active { background: #fff; transform: scale(1.3); }

/* ── SOMOS: aliases + collage helpers ─────────────────── */
.lp-somos-eyebrow {
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--verde-oscuro);
  margin-bottom: .6rem;
}
.lp-btn-somos {
  display: inline-block;
  background: var(--cafe-oscuro);
  color: #fff;
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .85rem 2.2rem;
  border-radius: 30px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: background .2s, transform .25s, box-shadow .25s;
}
.lp-btn-somos:hover {
  background: var(--cafe-hover);
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(99,63,27,.35);
}

.lp-somos-sq {
  position: absolute;
  border-radius: 18px;
  z-index: 0;
}
.lp-somos-sq1 {
  top: 0; right: 0;
  width: 130px; height: 110px;
  background: var(--verde-oscuro);
}
.lp-somos-sq2 {
  bottom: 0; right: 30px;
  width: 90px; height: 80px;
  background: var(--cafe-oscuro);
  border-radius: 14px;
}
.lp-somos-img {
  position: absolute;
  border-radius: 20px;
  object-fit: cover;
  border: 3px solid #fff;
  box-shadow: 0 6px 24px rgba(0,0,0,.18);
}
.lp-somos-img1 { width: 230px; height: 270px; top: 20px; left: 0; z-index: 2; background: linear-gradient(135deg,#26472A,#1C4120); }
.lp-somos-img2 { width: 210px; height: 230px; bottom: 10px; left: 40px; z-index: 3; background: linear-gradient(135deg,#2e5233,#26472A); }
.lp-somos-img3 { width: 215px; height: 390px; top: 10px; right: 20px; z-index: 1; background: linear-gradient(135deg,#1C4120,#0f2d14); }

.lp-somos-foto {
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
  max-width: 560px;
}

/* ── PRODS: section header + arrow buttons ────────────── */
.lp-prods-verde { background: var(--verde-soft); }
.lp-prods-cafe  { background: var(--cafe-soft); }

.lp-prods-header {
  text-align: center;
  margin-bottom: 2.5rem;
  position: relative;
}
.lp-prods-eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--verde-oscuro);
  margin-bottom: .4rem;
}
.lp-prods-cafe .lp-prods-eyebrow { color: var(--cafe-medio); }

.lp-prods-title {
  font-family: 'Inter', sans-serif;
  font-size: 2.6rem;
  font-weight: 800;
  color: var(--cafe-oscuro);
  line-height: 1.1;
  letter-spacing: -.01em;
}
.lp-prods-cafe .lp-prods-title { color: var(--cafe-oscuro); }

.lp-prods-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  background: #fff;
  border: 1.5px solid rgba(28,65,32,.18);
  border-radius: 50%;
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  color: var(--verde-oscuro);
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
  transition: background .2s, border-color .2s;
}
.lp-prods-arrow:hover {
  background: var(--verde-oscuro);
  border-color: var(--verde-oscuro);
  color: #fff;
}
.lp-prods-arrow.prev { left: -18px; }
.lp-prods-arrow.next { right: -18px; }
.lp-prods-arrow svg { width: 16px; height: 16px; }

/* prod-card image wrapper */
.lp-prod-img-wrap {
  width: 100%;
  height: 200px;
  overflow: hidden;
  margin-bottom: 0;
  position: relative;
  border-radius: 20px 20px 0 0;
  background: #fff;
}
.lp-prod-img-placeholder {
  position: absolute;
  inset: 0;
  background: #fff;
  z-index: 0;
}
.lp-prod-img-placeholder.cafe { background: #fff; }
.lp-card-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;   /* imagen completa, sin recorte */
  padding: .8rem;
  z-index: 1;
  opacity: 0;
  transform: translateX(40px);
  transition: opacity .45s ease, transform .45s ease;
}
.lp-card-img.active {
  opacity: 1;
  transform: translateX(0);
}
.lp-card-img.leaving {
  opacity: 0;
  transform: translateX(-40px);
  transition: opacity .45s ease, transform .45s ease;
}
/* dots indicadores en la card */
.lp-card-dots {
  position: absolute;
  bottom: 6px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 5px;
  z-index: 5;
}
.lp-card-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,.5);
  transition: background .25s, transform .25s;
}
.lp-card-dot.active {
  background: #fff;
  transform: scale(1.35);
}

/* prod-badge simple (text + bold score inline) */
.lp-prod-badge {
  font-size: .72rem;
  font-weight: 600;
  color: var(--verde-oscuro);
  align-self: flex-end;
  margin-bottom: .5rem;
  background: var(--verde-soft);
  padding: .2rem .55rem;
  border-radius: 20px;
}
.lp-prod-badge strong {
  background: var(--verde-oscuro);
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  padding: .1rem .38rem;
  border-radius: 10px;
  margin-left: .2rem;
}
.lp-prod-badge.cafe strong { background: var(--cafe-oscuro); }

/* ── INFO CARDS: eyebrow + btn aliases ────────────────── */
.lp-info-card-eyebrow {
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--cafe-medio);
}
.lp-info-card-img {
  position: relative;
  overflow: hidden;
}
.lp-info-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative;
  z-index: 1;
}
.lp-info-card-img-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.lp-btn-info {
  display: inline-block;
  background: var(--cafe-oscuro);
  color: #fff;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .65rem 1.8rem;
  border-radius: 30px;
  border: none;
  cursor: pointer;
  align-self: flex-start;
  text-decoration: none;
  transition: background .2s;
}
.lp-btn-info:hover { background: var(--cafe-medio); color: #fff; }
.lp-btn-info.cafe  { background: var(--verde-oscuro); }
.lp-btn-info.cafe:hover { background: #26472A; }

/* ── COMENTARIOS ──────────────────────────────────────── */
.lp-reviews {
  background: var(--verde-soft, #ECF1EB);
  padding: 4.5rem 3rem;
}
.lp-reviews-inner {
  max-width: 1200px;
  margin: 0 auto;
}
.lp-reviews-header {
  text-align: center;
  margin-bottom: 2.5rem;
}
.lp-reviews-eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--verde-oscuro);
  margin-bottom: .5rem;
}
.lp-reviews-title {
  font-family: 'Inter', sans-serif;
  font-size: 2rem;
  font-weight: 400;
  color: var(--texto);
  line-height: 1.2;
}
.lp-reviews-title strong { font-weight: 800; }

.lp-reviews-carousel {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.lp-reviews-track-wrap { overflow: hidden; flex: 1; }
.lp-reviews-track {
  display: flex;
  gap: 1.2rem;
  transition: transform .35s ease;
}

.lp-review-card {
  flex: 0 0 calc(33.333% - 1rem);
  min-width: 260px;
  border-radius: 24px;
  padding: 2rem 1.8rem 1.5rem;
  display: flex;
  flex-direction: column;
  gap: .8rem;
  box-shadow: 0 4px 18px rgba(0,0,0,.10);
  transition: transform .25s, box-shadow .25s;
}
.lp-review-card:hover { transform: translateY(-4px); box-shadow: 0 10px 28px rgba(0,0,0,.16); }
.lp-review-cafe  { background: var(--cafe-oscuro);  color: rgba(255,255,255,.85); }
.lp-review-verde { background: var(--verde-oscuro); color: rgba(255,255,255,.85); }

.lp-review-quote-open,
.lp-review-quote-close {
  font-size: 3rem;
  line-height: 1;
  color: rgba(255,255,255,.25);
  font-family: 'Playfair Display', serif;
  user-select: none;
}
.lp-review-quote-close { text-align: right; margin-top: auto; }

.lp-review-text {
  font-size: .88rem;
  line-height: 1.7;
  color: rgba(255,255,255,.90);
  flex: 1;
  text-align: center;
}
.lp-review-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .25rem;
}
.lp-review-stars { color: #f5c842; font-size: .9rem; letter-spacing: .05em; }
.lp-review-autor { font-size: .78rem; font-weight: 700; color: rgba(255,255,255,.75); }
.lp-review-cargo { font-weight: 400; }

.lp-reviews-arrow {
  flex-shrink: 0;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--cafe-oscuro);
  border: none;
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background .2s;
}
.lp-reviews-arrow:hover { background: var(--cafe-hover); }
.lp-reviews-arrow svg { width: 18px; height: 18px; }

.lp-reviews-dots {
  display: flex;
  justify-content: center;
  gap: .5rem;
  margin-top: 1.5rem;
}
.lp-reviews-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: rgba(28,65,32,.25);
  border: none;
  cursor: pointer;
  padding: 0;
  transition: background .2s, transform .2s;
}
.lp-reviews-dot.active { background: var(--verde-oscuro); transform: scale(1.35); }

/* ── FOOTER — estilos en partials/footer.php ──────────── */
/* Los estilos del footer están en tienda-laperla/partials/footer.php
   para mantenerlos junto al markup y evitar duplicación. */

/* ── RESPONSIVE (updated) ─────────────────────────────── */
@media (max-width: 992px) {
  .lp-header { padding: 0 1rem; }
  .lp-hero-content { padding: 2rem 3rem; }
  .lp-banners { grid-template-columns: 1fr; padding: 1rem 2rem; gap: .8rem; }
  .lp-cats-inner { padding: 0 2.5rem; }
  .lp-somos-inner { grid-template-columns: 1fr; }
  .lp-somos-collage { height: 320px; }
  .lp-pack-card { flex: 0 0 calc(50% - .6rem); min-width: 180px; }
  .lp-packs-bean { width: 80px; opacity: .6; }
  .lp-info-cards { grid-template-columns: 1fr; padding: 1.5rem; }
  /* footer responsive en partials/footer.php */
}

@media (max-width: 768px) {
  .lp-nav { display: none; }
  .lp-whatsapp small, .lp-login small { display: none; }
  .lp-hero-content { flex-direction: column; padding: 2rem 2rem; }
  .lp-hero-img { display: none; }
  .lp-hero-price { display: none; }
  .lp-hero-title { font-size: 2rem; }
  .lp-hero-title em { font-size: 2.4rem; }
  .lp-prods-section { padding: 3rem 1.5rem; }
  .lp-prod-card { flex: 0 0 calc(50% - .6rem); min-width: 160px; }
  .lp-pack-card { flex: 0 0 calc(50% - .6rem); min-width: 160px; }
  .lp-packs { padding: 3rem 1rem; }
  .lp-packs-title { font-size: 2rem; }
  .lp-packs-bean { width: 60px; opacity: .5; }
  .lp-info-card { grid-template-columns: 1fr; }
  /* footer responsive en partials/footer.php */
  /* Hero slide tablet: proporcional al ancho */
  .lp-hero-slide,
  a.lp-hero-slide--link {
    min-height: 0;
    aspect-ratio: 16 / 6;
  }
  .lp-hero-bg { background-size: cover; background-position: center; }
  .lp-hero-slide--db:not(.lp-hero-slide--clean) .lp-hero-content { padding: 1.5rem 2rem; }
  .lp-hero-slide--db:not(.lp-hero-slide--clean) .lp-hero-title { font-size: 1.6rem; }
  .lp-hero-slide--db:not(.lp-hero-slide--clean) .lp-hero-promo .big { font-size: 3rem; }
}

/* ── Hero en móvil ─────────────────────────────────────── */
@media (max-width: 640px) {
  /* aspect-ratio 3:1 = coincide con banners panorámicos sin espacios vacíos */
  .lp-hero-slide,
  a.lp-hero-slide--link {
    min-height: 0;
    aspect-ratio: 3 / 1;
  }
  /* cover: llena todo el contenedor sin espacios */
  .lp-hero-bg {
    background-size: cover;
    background-position: center center;
  }
  /* Texto superpuesto abajo con gradiente vertical */
  .lp-hero-content {
    padding: .75rem 1rem !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: flex-start;
  }
  .lp-hero-slide::before {
    background: linear-gradient(to top,
      rgba(0,0,0,.65) 0%,
      rgba(0,0,0,.2)  45%,
      transparent     100%);
  }
  .lp-hero-title     { font-size: 1.1rem !important; margin-bottom: .1rem; }
  .lp-hero-title em  { font-size: 1.25rem !important; }
  .lp-hero-subtitle  { font-size: .75rem; }
  .lp-hero-promo .big { font-size: 2rem !important; }
  .lp-hero-promo .pct { font-size: 1.1rem !important; }
  .lp-hero-promo .dto { font-size: .9rem !important; }
  .lp-btn-hero { padding: .45rem 1rem; font-size: .78rem; margin-top: .3rem; }
  .lp-hero-arrow { width: 32px; height: 32px; }
  .lp-hero-arrow svg { width: 14px; height: 14px; }
  .lp-hero-arrow.prev { left: .4rem; }
  .lp-hero-arrow.next { right: .4rem; }
  .lp-hero-dots { bottom: .4rem; }

  /* Jaladores full-width en móvil */
  .lp-banners {
    grid-template-columns: 1fr;
    padding: .5rem .5rem 1rem;
    gap: .5rem;
  }
  .lp-banner,
  .lp-banner--imagen {
    border-radius: 10px;
  }
  .lp-banner-img-full {
    border-radius: 10px;
    width: 100%;
    height: auto;
    display: block;
  }
}

/* ── Reviews + Pack Selección en móvil (≤ 480px) ─────── */
@media (max-width: 480px) {

  /* ── Secciones de productos (Café / Chocolate) ───────── */
  .lp-prods-section { padding: 2.5rem .75rem 2rem; }
  .lp-prods-header  { margin-bottom: 1.25rem; }
  .lp-prods-eyebrow { font-size: .7rem; }
  .lp-prods-title   { font-size: 1.6rem; }

  /* Ocultar flechas absolutas que sobresalen y tapan las tarjetas */
  .lp-prods-arrow { display: none; }

  /* Carousel ocupa todo el ancho */
  .lp-prods-carousel { padding: 0; }
  .lp-prods-track-wrap { overflow: hidden; width: 100%; }
  .lp-prods-track { gap: .75rem; padding: 0 .25rem .5rem; }

  /* Tarjeta: 82vw → asoma la siguiente */
  .lp-prod-card {
    flex: 0 0 82vw !important;
    min-width: 0 !important;
    max-width: 340px;
  }

  /* ── Comentarios ─────────────────────── */
  .lp-reviews { padding: 2.5rem .75rem 2rem; }
  .lp-reviews-title { font-size: 1.45rem; line-height: 1.2; }
  .lp-reviews-eyebrow { font-size: .7rem; }
  .lp-reviews-header { margin-bottom: 1.25rem; }

  /* Ocultar flechas: swipe táctil */
  .lp-reviews-arrow { display: none; }
  .lp-reviews-carousel { gap: 0; }
  .lp-reviews-track-wrap { overflow: hidden; width: 100%; }
  .lp-reviews-track { gap: .75rem; padding: 0 .25rem .5rem; }

  /* Tarjeta: 86vw → asoma la siguiente */
  .lp-review-card {
    flex: 0 0 86vw;
    min-width: 0;
    max-width: 340px;
    padding: 1.4rem 1.2rem 1.1rem;
    border-radius: 18px;
  }
  .lp-review-text { font-size: .82rem; }
  .lp-review-quote-open,
  .lp-review-quote-close { font-size: 2.2rem; }
  .lp-reviews-dots { margin-top: 1rem; }

  .lp-packs {
    padding: 2.5rem .75rem 2rem;
  }
  /* Título más compacto */
  .lp-packs-title {
    font-size: 1.55rem;
    line-height: 1.15;
  }
  .lp-packs-eyebrow { font-size: .7rem; }
  .lp-packs-header  { margin-bottom: 1.25rem; }

  /* Ocultar flechas: en móvil se desliza con el dedo */
  .lp-packs-arrow { display: none; }

  /* Carousel ocupa todo el ancho */
  .lp-packs-carousel { gap: 0; }
  .lp-packs-track-wrap { overflow: hidden; width: 100%; }

  /* Cada tarjeta: 82% del ancho → se asoma la siguiente */
  .lp-pack-card {
    flex: 0 0 82vw;
    min-width: 0;
    max-width: 340px;
  }
  .lp-packs-track { gap: .75rem; padding: 0 .25rem .5rem; }

  /* Imagen más baja para que entre más contenido en pantalla */
  .lp-pack-img-wrap { height: 155px; }

  /* Ocultar decoraciones bean en pantallas muy pequeñas */
  .lp-packs-bean { display: none; }

  /* Descripción: reducir a 3 líneas visibles */
  .lp-pack-desc {
    font-size: .73rem;
    max-height: calc(1.5em * 3);
  }
  .lp-pack-name { font-size: .85rem; }
  .lp-pack-price { font-size: 1rem; }
}


/* ═══════════════════════════════════════════════════════
   PÁGINA NOSOTROS
   ═══════════════════════════════════════════════════════ */

/* ── HERO ─────────────────────────────────────────────── */
.lp-nos-hero {
  position: relative;
  height: 280px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: var(--verde-oscuro);
}
.lp-nos-hero-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transform: scale(1.04);
  transition: transform 8s ease;
}
.lp-nos-hero:hover .lp-nos-hero-bg { transform: scale(1); }
.lp-nos-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(28,65,32,.68) 0%, rgba(28,65,32,.82) 100%);
}
.lp-nos-hero-content {
  position: relative;
  z-index: 1;
  text-align: center;
  color: #fff;
  padding: 0 1.5rem;
}
.lp-nos-hero-eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--cafe-claro);
  margin: 0 0 .8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
}
.lp-nos-hero-eyebrow::before,
.lp-nos-hero-eyebrow::after {
  content: '';
  width: 32px;
  height: 1.5px;
  background: var(--cafe-claro);
  opacity: .7;
}
.lp-nos-hero-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(2.2rem, 5vw, 3.8rem);
  font-weight: 800;
  letter-spacing: -.02em;
  color: #fff;
  margin: 0;
  line-height: 1.1;
}

/* ── HISTORIA ─────────────────────────────────────────── */
.lp-nos-historia {
  padding: 5rem 1.5rem;
  background: #fff;
}
.lp-nos-hist-inner {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}
.lp-nos-eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--cafe-claro);
  margin: 0 0 .75rem;
}
.lp-nos-hist-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  font-weight: 800;
  color: var(--verde-oscuro);
  line-height: 1.15;
  margin: 0 0 1.25rem;
}
.lp-nos-hist-desc {
  font-size: .95rem;
  line-height: 1.8;
  color: #444;
  margin-bottom: 1.8rem;
}
.lp-nos-btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: var(--cafe-oscuro);
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .75rem 1.6rem;
  border-radius: 8px;
  text-decoration: none;
  transition: background .2s;
}
.lp-nos-btn:hover { background: var(--cafe-hover); color: #fff; }
.lp-nos-hist-img-wrap {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 20px 56px rgba(0,0,0,.22);
  height: 420px;
}
.lp-nos-hist-single-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .7s cubic-bezier(.25,.46,.45,.94);
  will-change: transform;
}
.lp-nos-hist-img-wrap:hover .lp-nos-hist-single-img {
  transform: scale(1.07) translateY(-6px);
}

/* ── DATOS EMPRESA ────────────────────────────────────── */
.lp-nos-datos {
  padding: 5rem 1.5rem;
  background: #fafaf8;
}
.lp-nos-datos-inner {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4.5rem;
  align-items: start;
}
.lp-nos-datos-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  font-weight: 800;
  color: var(--verde-oscuro);
  line-height: 1.15;
  margin: 0 0 1.5rem;
}
.lp-nos-datos-desc {
  font-size: .95rem;
  line-height: 1.85;
  color: #444;
  margin-bottom: 2rem;
}
.lp-nos-datos-desc strong,
.lp-nos-datos-desc b { font-weight: 700; color: #1a1a1a; }
.lp-nos-ubicacion {
  background: #e8f0e9;
  border-left: 4px solid var(--verde-oscuro);
  border-radius: 0 14px 14px 0;
  padding: 1.25rem 1.5rem;
}
.lp-nos-ubicacion-title {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-family: 'Inter', sans-serif;
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--verde-oscuro);
  margin: 0 0 .75rem;
}
.lp-nos-ubicacion-desc {
  font-size: .9rem;
  line-height: 1.8;
  color: #3a4a3a;
}
.lp-nos-datos-right {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.lp-nos-datos-img-wrap {
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 16px 48px rgba(0,0,0,.18);
  aspect-ratio: 3/4;
}
.lp-nos-datos-img-wrap img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .7s cubic-bezier(.25,.46,.45,.94);
  will-change: transform;
}
.lp-nos-datos-img-wrap:hover img { transform: scale(1.06) translateY(-5px); }
.lp-nos-datos-card {
  background: #fff;
  border-radius: 14px;
  padding: 1.4rem 1.6rem;
  box-shadow: 0 6px 24px rgba(0,0,0,.09);
  border-top: 3px solid var(--cafe-claro);
}
.lp-nos-datos-card-title {
  font-family: 'Inter', sans-serif;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--cafe-oscuro);
  margin: 0 0 .65rem;
}
.lp-nos-datos-card-desc {
  font-size: .88rem;
  line-height: 1.8;
  color: #555;
}
@media (max-width: 900px) {
  .lp-nos-datos-inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .lp-nos-datos-img-wrap { aspect-ratio: 16/9; }
}

/* ── VISIÓN & MISIÓN ──────────────────────────────────── */
.lp-nos-vm {
  background: var(--cafe-oscuro);
  padding: 5rem 1.5rem;
  position: relative;
  overflow: hidden;
}

/* Keyframes granos VM */
@keyframes lp-vm-float-a {
  0%,100% { transform: translateY(0)    rotate(0deg)   scale(1);    }
  30%      { transform: translateY(-18px) rotate(8deg)  scale(1.06); }
  65%      { transform: translateY(-8px)  rotate(-4deg) scale(.97);  }
}
@keyframes lp-vm-float-b {
  0%,100% { transform: translateY(0)    rotate(0deg)    scale(1);    }
  40%      { transform: translateY(14px) rotate(-10deg) scale(1.08); }
  70%      { transform: translateY(5px)  rotate(5deg)   scale(.95);  }
}
@keyframes lp-vm-float-c {
  0%,100% { transform: translateY(0)     rotate(0deg)  scale(1);    }
  25%      { transform: translateY(-22px) rotate(12deg) scale(1.1);  }
  55%      { transform: translateY(-6px)  rotate(-6deg) scale(.96);  }
}
@keyframes lp-vm-float-d {
  0%,100% { transform: translateY(0)    rotate(0deg)   scale(1);    }
  45%      { transform: translateY(16px) rotate(-8deg) scale(1.05); }
  80%      { transform: translateY(4px)  rotate(6deg)  scale(.98);  }
}

.lp-vm-bean {
  position: absolute;
  pointer-events: none;
  will-change: transform;
  z-index: 0;
  opacity: .75;
  filter: drop-shadow(0 4px 12px rgba(0,0,0,.35));
}
/* posiciones y tamaños individuales */
/* Izquierda — arriba */
.lp-vm-bean--1 { width:120px; top: -15px;   left: -25px; animation: lp-vm-float-a 6.2s ease-in-out infinite;        opacity:.90; }
/* Izquierda — abajo */
.lp-vm-bean--3 { width:130px; bottom: -15px; left: -20px; animation: lp-vm-float-c 7.1s ease-in-out infinite 1.0s;  opacity:.85; }
/* Izquierda — medio */
.lp-vm-bean--5 { width: 70px; top: 42%;     left: -18px; animation: lp-vm-float-b 5.8s ease-in-out infinite 0.5s;  opacity:.65; }
/* Derecha — arriba */
.lp-vm-bean--4 { width:115px; top: -15px;   right: -25px; animation: lp-vm-float-d 6.6s ease-in-out infinite;       opacity:.90; }
/* Derecha — abajo */
.lp-vm-bean--2 { width:125px; bottom: -15px; right: -20px; animation: lp-vm-float-b 5.8s ease-in-out infinite 1.3s; opacity:.85; }
/* Derecha — medio */
.lp-vm-bean--6 { width: 65px; top: 38%;     right: -18px; animation: lp-vm-float-a 6.8s ease-in-out infinite 0.9s; opacity:.65; }
/* Ocultos — no se usan */
.lp-vm-bean--7, .lp-vm-bean--8 { display: none; }
.lp-nos-vm-inner {
  max-width: 900px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  position: relative;
  z-index: 1;
}
.lp-nos-vm-card {
  background: rgba(255,255,255,.08);
  border: 1.5px solid rgba(255,255,255,.15);
  border-radius: 20px;
  padding: 2.5rem 2rem;
  backdrop-filter: blur(6px);
  transition: background .2s, transform .2s;
}
.lp-nos-vm-card:hover {
  background: rgba(255,255,255,.14);
  transform: translateY(-4px);
}
.lp-nos-vm-icon {
  width: 52px; height: 52px;
  background: rgba(196,146,74,.15);
  border: 1.5px solid rgba(196,146,74,.35);
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 1.2rem;
  color: var(--cafe-claro);
}
.lp-nos-vm-icon svg { width: 24px; height: 24px; }
.lp-nos-vm-card h3 {
  font-family: 'Inter', sans-serif;
  font-size: 1.35rem;
  font-weight: 800;
  color: #fff;
  margin: 0 0 .75rem;
}
.lp-nos-vm-card p {
  font-size: .9rem;
  line-height: 1.75;
  color: rgba(255,255,255,.78);
  margin: 0;
}

/* ── GALERÍA NOSOTROS ─────────────────────────────────── */
.lp-nos-galeria {
  padding: 5rem 1.5rem;
  background: #faf8f5;
}
.lp-nos-gal-inner {
  max-width: 1200px;
  margin: 0 auto;
}
.lp-nos-gal-title {
  font-family: 'Inter', sans-serif;
  font-size: 2.2rem;
  font-weight: 800;
  color: var(--cafe-oscuro);
  text-align: center;
  margin: .4rem 0 2.5rem;
}
.lp-nos-gal-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: .5rem;
}
.lp-nos-gal-item {
  position: relative;
  aspect-ratio: 1;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
}
.lp-nos-gal-item img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.lp-nos-gal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(28,65,32,0);
  transition: background .3s ease;
}
.lp-nos-gal-item { cursor: pointer; }
.lp-nos-gal-item:hover img { transform: scale(1.08); }
.lp-nos-gal-item:hover .lp-nos-gal-overlay { background: rgba(28,65,32,.45); }
.lp-nos-gal-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
}
.lp-gal-zoom-icon {
  width: 36px; height: 36px;
  opacity: 0;
  transform: scale(.7);
  transition: opacity .25s, transform .25s;
}
.lp-nos-gal-item:hover .lp-gal-zoom-icon { opacity: 1; transform: scale(1); }

/* Lightbox */
.lp-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.92);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s;
}
.lp-lightbox.active { opacity: 1; pointer-events: all; }
.lp-lb-content {
  position: relative;
  max-width: 90vw;
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
}
.lp-lb-content img {
  max-width: 90vw;
  max-height: 82vh;
  object-fit: contain;
  border-radius: 10px;
  box-shadow: 0 8px 48px rgba(0,0,0,.6);
  transition: opacity .2s;
}
.lp-lb-counter {
  font-family: 'Inter', sans-serif;
  font-size: .8rem;
  font-weight: 600;
  color: rgba(255,255,255,.6);
  letter-spacing: .08em;
}
.lp-lb-close {
  position: fixed;
  top: 1.2rem; right: 1.4rem;
  background: rgba(255,255,255,.12);
  border: none;
  color: #fff;
  font-size: 1.8rem;
  line-height: 1;
  width: 44px; height: 44px;
  border-radius: 50%;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .2s;
  z-index: 10000;
}
.lp-lb-close:hover { background: rgba(255,255,255,.25); }
.lp-lb-arrow {
  position: fixed;
  top: 50%; transform: translateY(-50%);
  background: rgba(255,255,255,.12);
  border: none;
  color: #fff;
  width: 50px; height: 50px;
  border-radius: 50%;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .2s;
  z-index: 10000;
}
.lp-lb-arrow svg { width: 24px; height: 24px; }
.lp-lb-arrow:hover { background: rgba(255,255,255,.28); }
.lp-lb-prev { left: 1.2rem; }
.lp-lb-next { right: 1.2rem; }

@media (max-width: 900px) {
  .lp-nos-gal-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 540px) {
  .lp-nos-gal-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── PRINCIPIOS ───────────────────────────────────────── */
.lp-nos-principios {
  background: var(--verde-oscuro);
  padding: 4.5rem 1.5rem;
}
.lp-nos-prc-inner {
  max-width: 860px;
  margin: 0 auto;
  text-align: center;
}
.lp-nos-prc-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  font-weight: 800;
  color: #fff;
  margin: 0 0 2rem;
}
.lp-nos-pills {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  justify-content: center;
}
.lp-nos-pill {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  border: 1.5px solid rgba(255,255,255,.35);
  border-radius: 100px;
  padding: .5rem 1.1rem;
  font-family: 'Inter', sans-serif;
  font-size: .78rem;
  font-weight: 600;
  color: #fff;
  transition: background .18s, border-color .18s;
}
.lp-nos-pill:hover {
  background: rgba(255,255,255,.1);
  border-color: rgba(255,255,255,.6);
}
.lp-nos-pill svg { color: var(--cafe-claro); }

/* ── VALORES ──────────────────────────────────────────── */
.lp-nos-valores {
  background: #f6f4f0;
  padding: 5rem 1.5rem;
}
.lp-nos-val-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.lp-nos-val-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 800;
  color: var(--verde-oscuro);
  text-align: center;
  margin: 0 0 2.5rem;
}
.lp-nos-val-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem;
}
.lp-nos-val-card {
  background: #fff;
  border-radius: 18px;
  padding: 2rem 1.6rem;
  box-shadow: 0 2px 16px rgba(0,0,0,.06);
  border-top: 3px solid transparent;
  position: relative;
  overflow: hidden;
  transition: transform .35s cubic-bezier(.25,.46,.45,.94),
              box-shadow .35s cubic-bezier(.25,.46,.45,.94),
              border-color .35s ease;
}
.lp-nos-val-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(28,65,32,.04) 0%, rgba(196,146,74,.06) 100%);
  opacity: 0;
  transition: opacity .35s ease;
  border-radius: inherit;
}
.lp-nos-val-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 48px rgba(28,65,32,.14);
  border-top-color: var(--cafe-claro);
}
.lp-nos-val-card:hover::before { opacity: 1; }
.lp-nos-val-icon {
  font-size: 2rem;
  margin-bottom: .9rem;
  display: flex;
  align-items: center;
  transition: transform .35s cubic-bezier(.25,.46,.45,.94);
}
.lp-nos-val-card:hover .lp-nos-val-icon { transform: scale(1.18) translateY(-3px); }
.lp-nos-val-name {
  font-family: 'Inter', sans-serif;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--verde-oscuro);
  margin: 0 0 .5rem;
  transition: color .25s ease;
}
.lp-nos-val-card:hover .lp-nos-val-name { color: var(--cafe-oscuro); }
.lp-nos-val-desc {
  font-size: .84rem;
  line-height: 1.7;
  color: #666;
  margin: 0;
}

/* ── TIMELINE ─────────────────────────────────────────── */
.lp-nos-timeline {
  background: #fff;
  padding: 5rem 1.5rem;
}
.lp-nos-tl-inner {
  max-width: 820px;
  margin: 0 auto;
}
.lp-nos-tl-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 800;
  color: var(--verde-oscuro);
  text-align: center;
  margin: 0 0 3rem;
}
.lp-nos-tl-track {
  position: relative;
  padding: .5rem 0;
}
.lp-nos-tl-line {
  position: absolute;
  left: 50%;
  top: 0; bottom: 0;
  width: 2px;
  background: linear-gradient(to bottom, transparent, var(--verde-oscuro) 8%, var(--cafe-claro) 50%, var(--verde-oscuro) 92%, transparent);
  transform: translateX(-50%);
  opacity: .35;
}
.lp-nos-tl-item {
  display: grid;
  grid-template-columns: 1fr 32px 1fr;
  align-items: center;
  margin-bottom: 2.8rem;
  gap: 0;
}
.lp-nos-tl-left .lp-nos-tl-card  { grid-column: 1; text-align: right; padding-right: 2.2rem; }
.lp-nos-tl-left .lp-nos-tl-dot   { grid-column: 2; }
.lp-nos-tl-left .lp-nos-tl-spacer{ grid-column: 3; }
.lp-nos-tl-right .lp-nos-tl-spacer{ grid-column: 1; }
.lp-nos-tl-right .lp-nos-tl-dot  { grid-column: 2; }
.lp-nos-tl-right .lp-nos-tl-card { grid-column: 3; text-align: left; padding-left: 2.2rem; }
.lp-nos-tl-card {
  background: #fff;
  border: 1.5px solid #e9ecef;
  border-radius: 16px;
  padding: 1.3rem 1.5rem;
  box-shadow: 0 2px 14px rgba(0,0,0,.05);
  position: relative;
  overflow: hidden;
  transition: transform .3s cubic-bezier(.25,.46,.45,.94),
              border-color .3s ease,
              box-shadow .3s ease;
}
.lp-nos-tl-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--verde-oscuro), var(--cafe-claro));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s cubic-bezier(.25,.46,.45,.94);
}
.lp-nos-tl-card:hover {
  transform: translateY(-4px);
  border-color: var(--cafe-claro);
  box-shadow: 0 12px 32px rgba(28,65,32,.1);
}
.lp-nos-tl-card:hover::after { transform: scaleX(1); }
.lp-nos-tl-anio {
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  font-weight: 800;
  color: var(--verde-oscuro);
  margin-bottom: .45rem;
  letter-spacing: .02em;
}
.lp-nos-tl-desc {
  font-size: .84rem;
  line-height: 1.7;
  color: #555;
  margin: 0;
}
.lp-nos-tl-dot {
  width: 20px; height: 20px;
  background: var(--verde-oscuro);
  border: 3px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 3px var(--verde-oscuro);
  justify-self: center;
  z-index: 1;
  transition: background .3s, box-shadow .3s, transform .3s;
}
.lp-nos-tl-item:hover .lp-nos-tl-dot {
  background: var(--cafe-claro);
  box-shadow: 0 0 0 3px var(--cafe-claro);
  transform: scale(1.2);
}

/* ── EQUIPO ───────────────────────────────────────────── */
.lp-nos-equipo {
  background: #f6f4f0;
  padding: 5rem 1.5rem;
}
.lp-nos-eq-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.lp-nos-eq-title {
  font-family: 'Inter', sans-serif;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 800;
  color: var(--verde-oscuro);
  text-align: center;
  margin: 0 0 2.5rem;
}
.lp-nos-eq-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}
.lp-nos-eq-card {
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 2px 16px rgba(0,0,0,.07);
  transition: transform .2s, box-shadow .2s;
  text-align: center;
}
.lp-nos-eq-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 40px rgba(0,0,0,.13);
}
.lp-nos-eq-photo {
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  background: #f0ece4;
}
.lp-nos-eq-photo img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: top center;
  transition: transform .4s;
}
.lp-nos-eq-card:hover .lp-nos-eq-photo img { transform: scale(1.04); }
.lp-nos-eq-placeholder {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  color: #c4b89e;
}
.lp-nos-eq-placeholder svg { width: 48px; height: 48px; }
.lp-nos-eq-info {
  padding: 1.2rem 1rem 1.4rem;
}
.lp-nos-eq-nombre {
  font-family: 'Inter', sans-serif;
  font-size: .92rem;
  font-weight: 700;
  color: var(--cafe-claro);
  margin: 0 0 .25rem;
  line-height: 1.3;
}
.lp-nos-eq-puesto {
  font-size: .75rem;
  color: #888;
  margin: 0 0 .9rem;
}
.lp-nos-eq-socials {
  display: flex;
  justify-content: center;
  gap: .5rem;
}
.lp-nos-eq-social {
  width: 32px; height: 32px;
  background: #f3f4f6;
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  color: var(--verde-oscuro);
  transition: background .15s, color .15s;
  text-decoration: none;
}
.lp-nos-eq-social:hover { background: var(--verde-oscuro); color: #fff; }
.lp-nos-eq-social svg { width: 15px; height: 15px; }

/* ── Responsive nosotros ──────────────────────────────── */
@media (max-width: 900px) {
  .lp-nos-hist-inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .lp-nos-hist-img-wrap { height: 260px; }
  .lp-nos-vm-inner { grid-template-columns: 1fr; }
  .lp-vm-bean--5,.lp-vm-bean--6,.lp-vm-bean--7,.lp-vm-bean--8 { display: none; }
  .lp-vm-bean--1,.lp-vm-bean--2,.lp-vm-bean--3,.lp-vm-bean--4 { width: 70px; opacity:.5; }
  .lp-nos-val-grid { grid-template-columns: repeat(2, 1fr); }
  .lp-nos-eq-grid { grid-template-columns: repeat(2, 1fr); }
  .lp-nos-tl-item { grid-template-columns: 1fr 20px 1fr; }
}
@media (max-width: 580px) {
  .lp-nos-hero { height: 200px; }
  .lp-nos-val-grid { grid-template-columns: 1fr; }
  .lp-nos-eq-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
  .lp-nos-tl-item {
    grid-template-columns: 20px 1fr;
    grid-template-rows: auto;
  }
  .lp-nos-tl-left .lp-nos-tl-card,
  .lp-nos-tl-right .lp-nos-tl-card {
    grid-column: 2; grid-row: 1;
    text-align: left; padding-left: 1.2rem; padding-right: 0;
  }
  .lp-nos-tl-left .lp-nos-tl-dot,
  .lp-nos-tl-right .lp-nos-tl-dot { grid-column: 1; grid-row: 1; }
  .lp-nos-tl-left .lp-nos-tl-spacer,
  .lp-nos-tl-right .lp-nos-tl-spacer { display: none; }
  .lp-nos-tl-line { left: 10px; transform: none; }
}

/* active nav link */
.lp-nav a.active { color: var(--cafe-claro); font-weight: 700; }


/* ═══════════════════════════════════════════════════════════════
   TIENDA — PÁGINA DE CATÁLOGO (/tienda.php)
   ═══════════════════════════════════════════════════════════════ */

/* ── Hero buscador ────────────────────────────────────── */
.lp-shop-hero {
  background: linear-gradient(135deg, var(--verde-oscuro) 0%, #26472A 60%, #1a3d1e 100%);
  padding: 1.8rem 2.5rem 1.6rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.lp-shop-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Ccircle cx='20' cy='20' r='2'/%3E%3C/g%3E%3C/svg%3E");
  pointer-events: none;
}
.lp-shop-hero-inner { position: relative; max-width: 680px; margin: 0 auto; }

/* Searchbar */
.lp-shop-searchbar-wrap {
  display: flex;
  align-items: center;
  background: #fff;
  border-radius: 50px;
  box-shadow: 0 2px 16px rgba(0,0,0,.14);
  padding: .28rem .28rem .28rem 1.1rem;
  gap: .4rem;
  max-width: 600px;
  margin: 0 auto .9rem;
}
.lp-shop-searchbar-icon { color: #aaa; display: flex; align-items: center; flex-shrink: 0; }
.lp-shop-searchbar-icon svg { width: 20px; height: 20px; }
.lp-shop-searchbar-input {
  flex: 1;
  border: none;
  outline: none;
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  color: var(--texto);
  background: transparent;
  min-width: 0;
}
.lp-shop-searchbar-input::placeholder { color: #bbb; }
.lp-shop-searchbar-clear {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #bbb;
  transition: color .2s;
  flex-shrink: 0;
  padding: 0 4px;
}
.lp-shop-searchbar-clear:hover { color: var(--cafe-oscuro); }
.lp-shop-searchbar-clear svg { width: 16px; height: 16px; }
.lp-shop-searchbar-btn {
  background: var(--verde-oscuro);
  color: #fff;
  border: none;
  border-radius: 40px;
  padding: .65rem 1.6rem;
  font-family: 'Inter', sans-serif;
  font-size: .85rem;
  font-weight: 700;
  letter-spacing: .04em;
  cursor: pointer;
  transition: background .2s;
  flex-shrink: 0;
  white-space: nowrap;
}
.lp-shop-searchbar-btn:hover { background: var(--verde-hover); }

/* Quick cats */
.lp-shop-quickcats {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .5rem;
}
.lp-shop-qcat {
  display: inline-block;
  padding: .32rem .9rem;
  border: 1.5px solid rgba(255,255,255,.28);
  border-radius: 30px;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .04em;
  color: rgba(255,255,255,.78);
  transition: background .18s, border-color .18s, color .18s;
}
.lp-shop-qcat:hover,
.lp-shop-qcat.active {
  background: var(--cafe-claro);
  border-color: var(--cafe-claro);
  color: #fff;
}

/* ── Layout principal ─────────────────────────────────── */
.lp-shop-body {
  max-width: 1400px;
  margin: 0 auto;
  padding: 2.5rem 2rem;
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 2rem;
  align-items: start;
}

/* ── Sidebar ──────────────────────────────────────────── */
.lp-shop-sidebar {
  position: sticky;
  top: 90px;
  display: flex;
  flex-direction: column;
  gap: 1.4rem;
}
.lp-shop-sidebar-section {
  background: #fff;
  border: 1.5px solid rgba(28,65,32,.08);
  border-radius: 14px;
  padding: 1.1rem 1.2rem;
}
.lp-shop-sidebar-title {
  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #9ca3af;
  margin-bottom: .85rem;
}
.lp-shop-cats-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: .12rem;
}
.lp-shop-cat-link {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .45rem .5rem;
  border-radius: 8px;
  font-size: .83rem;
  font-weight: 500;
  color: var(--texto);
  transition: background .15s, color .15s;
  text-decoration: none;
}
.lp-shop-cat-link:hover { background: var(--verde-soft); color: var(--verde-oscuro); }
.lp-shop-cat-link.active {
  background: var(--verde-oscuro);
  color: #fff;
  font-weight: 700;
}
.lp-shop-cat-link.active .lp-shop-cat-count { background: rgba(255,255,255,.2); color: #fff; }
.lp-shop-cat-img {
  width: 26px; height: 26px;
  border-radius: 6px;
  object-fit: cover;
  flex-shrink: 0;
}
.lp-shop-cat-name { flex: 1; }
.lp-shop-cat-count {
  background: var(--verde-soft);
  color: var(--verde-oscuro);
  font-size: .72rem;
  font-weight: 700;
  padding: .15rem .5rem;
  border-radius: 20px;
  flex-shrink: 0;
}

/* Active filters */
.lp-shop-active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
}
.lp-shop-active-tag {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .3rem .7rem;
  background: var(--cafe-soft);
  color: var(--cafe-oscuro);
  border-radius: 20px;
  font-size: .75rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s;
}
.lp-shop-active-tag:hover { background: #e8d5c0; }
.lp-shop-clear-all {
  font-size: .75rem;
  color: #aaa;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.lp-shop-clear-all:hover { color: var(--cafe-oscuro); }

/* Order links */
.lp-shop-order-list {
  display: flex;
  flex-direction: column;
  gap: .12rem;
}
.lp-shop-order-link {
  display: block;
  padding: .4rem .5rem;
  border-radius: 8px;
  font-size: .82rem;
  font-weight: 500;
  color: #555;
  text-decoration: none;
  transition: background .15s, color .15s;
}
.lp-shop-order-link:hover { background: var(--verde-soft); color: var(--verde-oscuro); }
.lp-shop-order-link.active { color: var(--verde-oscuro); font-weight: 700; }
.lp-shop-order-link.active::before {
  content: '▸ ';
  color: var(--cafe-claro);
}

/* ── Área principal ───────────────────────────────────── */
.lp-shop-main { min-width: 0; }

/* Barra de controles */
.lp-shop-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.4rem;
  flex-wrap: wrap;
}
.lp-shop-results-info {
  font-size: .87rem;
  color: #666;
}
.lp-shop-results-info strong { color: var(--verde-oscuro); }
.lp-shop-results-info em { color: var(--cafe-oscuro); font-style: normal; font-weight: 600; }
.lp-shop-controls-right {
  display: flex;
  align-items: center;
  gap: .6rem;
}

/* Sort select (visible en móvil, oculto en desktop) */
.lp-shop-sort-wrap { display: none; }
.lp-shop-sort-select {
  border: 1.5px solid rgba(28,65,32,.15);
  border-radius: 8px;
  padding: .4rem .7rem;
  font-family: 'Inter', sans-serif;
  font-size: .82rem;
  color: var(--texto);
  background: #fff;
  outline: none;
  cursor: pointer;
}

/* Por página */
.lp-shop-perpage {
  display: flex;
  align-items: center;
  gap: .25rem;
  background: #f3f4f6;
  border-radius: 8px;
  padding: .2rem;
}
.lp-shop-pp-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 28px;
  border-radius: 6px;
  font-size: .78rem;
  font-weight: 600;
  color: #666;
  text-decoration: none;
  transition: background .15s, color .15s;
  padding: 0 .5rem;
}
.lp-shop-pp-btn:hover { background: #e5e7eb; color: var(--verde-oscuro); }
.lp-shop-pp-btn.active {
  background: var(--verde-oscuro);
  color: #fff;
}

/* Vista toggle */
.lp-shop-view-toggle {
  display: flex;
  align-items: center;
  gap: .25rem;
  background: #f3f4f6;
  border-radius: 8px;
  padding: .2rem;
}
.lp-shop-view-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 28px;
  border-radius: 6px;
  color: #aaa;
  text-decoration: none;
  transition: background .15s, color .15s;
}
.lp-shop-view-btn svg { width: 15px; height: 15px; }
.lp-shop-view-btn:hover { background: #e5e7eb; color: var(--verde-oscuro); }
.lp-shop-view-btn.active { background: var(--verde-oscuro); color: #fff; }

/* ── Grid de productos ────────────────────────────────── */
.lp-shop-grid {
  display: grid;
  gap: 1.2rem;
}
.lp-shop-grid.lp-shop-grid { grid-template-columns: repeat(3, 1fr); }
.lp-shop-list { grid-template-columns: 1fr; }

/* Tarjeta grid */
.lp-shop-card {
  background: #fff;
  border: 1.5px solid rgba(28,65,32,.08);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: border-color .22s, box-shadow .22s, transform .22s;
}
.lp-shop-card:hover {
  border-color: var(--cafe-claro);
  box-shadow: 0 8px 28px rgba(28,65,32,.10);
  transform: translateY(-3px);
}

/* Tarjeta en modo lista */
.lp-shop-list .lp-shop-card {
  flex-direction: row;
  align-items: stretch;
  border-radius: 14px;
}
.lp-shop-list .lp-shop-card:hover { transform: translateY(-2px); }

/* Imagen wrapper */
.lp-shop-card-img-wrap {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  display: block;
  flex-shrink: 0;
}
.lp-shop-list .lp-shop-card-img-wrap {
  width: 200px;
  aspect-ratio: unset;
  border-radius: 0;
}
.lp-shop-card-img-bg {
  position: absolute;
  inset: 0;
  background: var(--crema);
}
.lp-shop-card-img-wrap img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .35s;
}
.lp-shop-card:hover .lp-shop-card-img-wrap img { transform: scale(1.05); }
.lp-shop-card-noimg {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(99,63,27,.18);
}
.lp-shop-card-noimg svg { width: 50px; height: 50px; }

/* Badges */
.lp-shop-badge-off,
.lp-shop-badge-score {
  position: absolute;
  top: .6rem;
  left: .6rem;
  z-index: 2;
  padding: .22rem .55rem;
  border-radius: 20px;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .04em;
}
.lp-shop-badge-off {
  background: var(--cafe-oscuro);
  color: #fff;
}
.lp-shop-badge-score {
  background: var(--verde-oscuro);
  color: #fff;
}

/* Cuerpo tarjeta */
.lp-shop-card-body {
  padding: .9rem 1rem 1rem;
  display: flex;
  flex-direction: column;
  gap: .3rem;
  flex: 1;
  min-width: 0;
}
.lp-shop-card-cat {
  font-size: .67rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--cafe-medio);
}
.lp-shop-card-name {
  font-size: .95rem;
  font-weight: 700;
  color: var(--verde-oscuro);
  line-height: 1.35;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.lp-shop-card-name:hover { color: var(--cafe-oscuro); }
.lp-shop-card-weight {
  font-size: .78rem;
  color: #888;
  font-weight: 500;
}
.lp-shop-card-desc {
  font-size: .82rem;
  color: #666;
  line-height: 1.55;
  margin-top: .2rem;
}
.lp-shop-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  margin-top: auto;
  padding-top: .5rem;
}
.lp-shop-card-prices {
  display: flex;
  align-items: baseline;
  gap: .4rem;
  flex-wrap: wrap;
}
.lp-shop-price-main {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--verde-oscuro);
}
.lp-shop-price-old {
  font-size: .82rem;
  color: #bbb;
  text-decoration: line-through;
}
.lp-shop-price-new {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--cafe-oscuro);
}
.lp-shop-btn-add {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--verde-oscuro);
  color: #fff;
  border: none;
  cursor: pointer;
  flex-shrink: 0;
  transition: background .2s, transform .2s;
}
.lp-shop-btn-add:hover { background: var(--cafe-oscuro); transform: scale(1.1); }
.lp-shop-card-delivery {
  font-size: .72rem;
  color: #aaa;
  display: flex;
  align-items: center;
  gap: .3rem;
  margin-top: .2rem;
}

/* ── Estado vacío ─────────────────────────────────────── */
.lp-shop-empty {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 4rem 2rem;
  text-align: center;
  color: #ccc;
}
.lp-shop-empty svg { width: 64px; height: 64px; }
.lp-shop-empty p { font-size: 1rem; color: #999; }
.lp-shop-empty-link {
  display: inline-block;
  padding: .6rem 1.4rem;
  background: var(--verde-oscuro);
  color: #fff;
  border-radius: 30px;
  font-size: .85rem;
  font-weight: 700;
  text-decoration: none;
  transition: background .2s;
}
.lp-shop-empty-link:hover { background: var(--verde-hover); }

/* ── Paginación ───────────────────────────────────────── */
.lp-shop-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  margin-top: 2.5rem;
  flex-wrap: wrap;
}
.lp-shop-page-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 38px;
  padding: 0 .5rem;
  border-radius: 8px;
  font-size: .85rem;
  font-weight: 600;
  color: var(--verde-oscuro);
  border: 1.5px solid rgba(28,65,32,.15);
  background: #fff;
  text-decoration: none;
  transition: background .18s, border-color .18s, color .18s;
}
.lp-shop-page-btn:hover {
  background: var(--verde-soft);
  border-color: var(--verde-oscuro);
}
.lp-shop-page-btn.active {
  background: var(--verde-oscuro);
  border-color: var(--verde-oscuro);
  color: #fff;
  cursor: default;
  pointer-events: none;
}
.lp-shop-page-prev svg,
.lp-shop-page-next svg { width: 16px; height: 16px; }
.lp-shop-page-dots {
  font-size: .9rem;
  color: #ccc;
  padding: 0 .3rem;
}

/* ── Responsive ───────────────────────────────────────── */
@media (max-width: 1100px) {
  .lp-shop-grid.lp-shop-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .lp-shop-body {
    grid-template-columns: 1fr;
    padding: 1.5rem 1rem;
  }
  .lp-shop-sidebar {
    position: static;
    flex-direction: row;
    flex-wrap: wrap;
    gap: .8rem;
  }
  .lp-shop-sidebar-section { flex: 1 1 240px; }
  .lp-shop-sort-wrap { display: block; }
  .lp-shop-hero { padding: 1.2rem 1rem 1rem; }
}
@media (max-width: 600px) {
  .lp-shop-grid.lp-shop-grid { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
  .lp-shop-list .lp-shop-card { flex-direction: column; }
  .lp-shop-list .lp-shop-card-img-wrap { width: 100%; aspect-ratio: 4/3; }
  .lp-shop-perpage { display: none; }
  .lp-shop-hero-title { font-size: 1.8rem; }
}


/* ═══════════════════════════════════════════════════════
   PÁGINA DE PROMOCIONES
   ═══════════════════════════════════════════════════════ */

/* ── Hero promo ───────────────────────────────────────── */
.lp-promo-hero {
  background: var(--verde-oscuro);
  display: flex;
  align-items: center;
  gap: 0;
  min-height: 420px;
  overflow: hidden;
  position: relative;
}
.lp-promo-hero-content {
  flex: 1;
  padding: 4rem 3.5rem 4rem 4rem;
  color: #fff;
  z-index: 2;
}
.lp-promo-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  font-family: 'Inter', sans-serif;
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .16em;
  color: var(--cafe-claro);
  margin-bottom: 1.1rem;
}
.lp-promo-hero-title {
  font-family: 'Inter', sans-serif;
  font-size: 3.2rem;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -.025em;
  color: #fff;
  margin: 0 0 1rem;
}
.lp-promo-hero-sub {
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  font-weight: 400;
  color: rgba(255,255,255,.80);
  margin: 0 0 2rem;
  max-width: 420px;
  line-height: 1.65;
}
.lp-promo-hero-btn {
  display: inline-block;
  padding: .75rem 2rem;
  background: var(--cafe-claro);
  color: #fff;
  font-weight: 700;
  font-size: .95rem;
  border-radius: 8px;
  text-decoration: none;
  transition: background .2s, transform .15s;
}
.lp-promo-hero-btn:hover {
  background: var(--cafe-oscuro);
  transform: translateY(-2px);
}
.lp-promo-hero-img-wrap {
  flex: 0 0 50%;
  max-width: 50%;
  height: 420px;
  overflow: hidden;
}
.lp-promo-hero-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* ── Countdown ────────────────────────────────────────── */
.lp-countdown-section {
  background: #f3f3f3;
  padding: 2.2rem 1.5rem;
  text-align: center;
  border-bottom: 1px solid #e8e8e8;
}
.lp-countdown-inner {
  max-width: 620px;
  margin: 0 auto;
}
.lp-countdown-label {
  font-family: 'Inter', sans-serif;
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .16em;
  color: var(--cafe-oscuro);
  margin-bottom: 1.2rem;
}
.lp-countdown-timer {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: .6rem;
}
.lp-cd-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: var(--verde-oscuro);
  color: #fff;
  border-radius: 10px;
  padding: 1rem 1.4rem;
  min-width: 80px;
}
.lp-cd-num {
  font-size: 2.4rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  font-family: 'Inter', sans-serif;
}
.lp-cd-unit {
  font-size: .7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: rgba(255,255,255,.65);
  margin-top: .35rem;
}
.lp-cd-sep {
  font-size: 2rem;
  font-weight: 900;
  color: var(--verde-oscuro);
  margin-top: .5rem;
  line-height: 1;
}

/* ── Sección genérica de promo ────────────────────────── */
.lp-promo-section {
  padding: 4rem 2rem;
}
.lp-promo-section:nth-child(even) {
  background: #fafaf8;
}
.lp-promo-section-inner {
  max-width: 1280px;
  margin: 0 auto;
}
.lp-promo-section-hd {
  text-align: center;
  margin-bottom: 2.5rem;
}
.lp-promo-eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .15em;
  color: var(--cafe-medio);
  margin-bottom: .45rem;
}
.lp-promo-section-title {
  font-family: 'Inter', sans-serif;
  font-size: 2.4rem;
  font-weight: 800;
  color: var(--cafe-oscuro);
  letter-spacing: -.01em;
  line-height: 1.1;
  margin: 0;
}
.lp-promo-empty {
  text-align: center;
  color: #999;
  font-size: .95rem;
  padding: 2rem 0;
}



/* ── Nuevos / Otras secciones ─────────────────────────── */
.lp-nuevos-section { background: #fff; }

/* ── Otras ofertas: filtro tabs ──────────────────────── */
.lp-otras-section { background: #fafaf8; }
.lp-otras-tabs {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
  margin-bottom: 2rem;
  justify-content: center;
}
.lp-otras-tab {
  padding: .5rem 1.2rem;
  border: 1.5px solid #ddd;
  border-radius: 999px;
  background: #fff;
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  color: #555;
  font-family: inherit;
  transition: border-color .2s, background .2s, color .2s;
}
.lp-otras-tab:hover {
  border-color: var(--verde-oscuro);
  color: var(--verde-oscuro);
}
.lp-otras-tab.active {
  background: var(--verde-oscuro);
  border-color: var(--verde-oscuro);
  color: #fff;
}


/* ── Feature Cards ───────────────────────────────────── */
.lp-feature-cards {
  padding: 3.5rem 2rem;
  background: #fafaf8;
}
.lp-feature-cards-inner {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}
.lp-feature-card {
  border-radius: 18px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 400px;
  position: relative;
}
.lp-feature-card--verde { background: var(--verde-oscuro); color: #fff; }
.lp-feature-card--cafe  { background: var(--cafe-oscuro);  color: #fff; }
.lp-feature-card-img-wrap {
  flex: 0 0 55%;
  max-height: 220px;
  overflow: hidden;
}
.lp-feature-card-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s;
}
.lp-feature-card:hover .lp-feature-card-img-wrap img { transform: scale(1.04); }
.lp-feature-card-body {
  padding: 1.8rem 2rem 2rem;
  display: flex;
  flex-direction: column;
  gap: .6rem;
  flex: 1;
}
.lp-feature-card-badge {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: var(--cafe-claro);
}
.lp-feature-card--cafe .lp-feature-card-badge { color: rgba(255,255,255,.7); }
.lp-feature-card-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 1.7rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
  line-height: 1.15;
}
.lp-feature-card-sub {
  font-size: .95rem;
  font-weight: 600;
  color: var(--cafe-claro);
  margin: 0;
}
.lp-feature-card--cafe .lp-feature-card-sub { color: rgba(255,255,255,.8); }
.lp-feature-card-desc {
  font-size: .85rem;
  color: rgba(255,255,255,.72);
  line-height: 1.6;
  margin: 0;
}
.lp-feature-card-btn {
  display: inline-block;
  margin-top: auto;
  padding: .6rem 1.4rem;
  background: rgba(255,255,255,.18);
  color: #fff;
  border: 1.5px solid rgba(255,255,255,.35);
  border-radius: 8px;
  font-size: .85rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .2s, border-color .2s;
  align-self: flex-start;
}
.lp-feature-card-btn:hover {
  background: rgba(255,255,255,.28);
  border-color: rgba(255,255,255,.6);
}

/* Badge descuento sobre la imagen de lp-prod-card en promo */
.lp-prod-badge-off-corner {
  position: absolute;
  top: 10px;
  left: 10px;
  background: var(--cafe-oscuro);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  padding: .22rem .5rem;
  border-radius: 6px;
  z-index: 3;
  pointer-events: none;
}

/* Grid nuevos productos en promo — usa misma card lp-prod-card */
.lp-nuevos-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.4rem;
}

/* Grid otras ofertas — idem */
.lp-otras-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.4rem;
}

/* Sección de carousel en promo usa mismas clases lp-prods-* del index */
.lp-promo-section .lp-prods-carousel { margin: 0; }
.lp-promo-section .lp-prods-track-wrap { overflow: hidden; }
.lp-promo-section .lp-prods-track { transition: transform .35s ease; }
.lp-promo-section .lp-prod-card { flex: 0 0 calc(33.333% - 16px); }

/* ── Cuponera ─────────────────────────────────────────── */
.lp-cupones-section {
  padding: 4rem 1.5rem;
  background: #f8f5f0;
}
.lp-cupones-inner {
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
}
.lp-cupones-sub {
  font-family: 'Inter', sans-serif;
  font-size: .95rem;
  color: #6b6b6b;
  margin: .5rem 0 2rem;
}
.lp-cupones-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.25rem;
  text-align: left;
}
.lp-cupon-card {
  width: 340px;
  display: flex;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 3px 16px rgba(0,0,0,.09);
  background: #fff;
  border: 1px solid #e8e0d5;
  min-height: 100px;
  transform: translateY(0);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  cursor: default;
}
.lp-cupon-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(28,65,32,.18);
  border-color: var(--verde-oscuro);
}
.lp-cupon-pct {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 90px;
  background: var(--verde-oscuro);
  color: #fff;
  font-family: 'Inter', sans-serif;
  font-size: 2rem;
  font-weight: 900;
  line-height: 1;
  padding: 1.4rem .8rem;
  flex-shrink: 0;
}
.lp-cupon-pct span {
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .12em;
  opacity: .85;
  margin-top: 4px;
}
.lp-cupon-body {
  padding: 1.1rem 1.25rem;
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .55rem;
}
.lp-cupon-desc {
  font-family: 'Inter', sans-serif;
  font-size: .8rem;
  color: #6b6b6b;
  margin: 0;
  line-height: 1.4;
}
.lp-cupon-code-wrap {
  display: flex;
  align-items: center;
  gap: .6rem;
  flex-wrap: nowrap;
}
.lp-cupon-code {
  font-family: 'Courier New', monospace;
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: .12em;
  color: var(--cafe-oscuro);
  background: #fdf3e3;
  border: 2px dashed var(--cafe-claro);
  border-radius: 7px;
  padding: .35rem .85rem;
  flex: 1;
  min-width: 0;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lp-cupon-copy {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-family: 'Inter', sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--verde-oscuro);
  background: #e8f0e8;
  border: 1.5px solid var(--verde-oscuro);
  border-radius: 7px;
  padding: .38rem .75rem;
  cursor: pointer;
  transition: background .15s, color .15s;
  white-space: nowrap;
  flex-shrink: 0;
}
.lp-cupon-copy:hover { background: var(--verde-oscuro); color: #fff; }

/* ── Responsive promo ─────────────────────────────────── */
@media (max-width: 1024px) {
  .lp-nuevos-grid  { grid-template-columns: repeat(3, 1fr); }
  .lp-otras-grid   { grid-template-columns: repeat(3, 1fr); }
  .lp-promo-section .lp-prod-card { flex: 0 0 calc(50% - 12px); }
}
@media (max-width: 768px) {
  .lp-promo-hero { flex-direction: column-reverse; min-height: auto; }
  .lp-promo-hero-img-wrap { flex: none; max-width: 100%; width: 100%; height: 240px; }
  .lp-promo-hero-content { padding: 2.5rem 1.5rem; }
  .lp-promo-hero-title { font-size: 2.2rem; }
  .lp-promo-section-title { font-size: 1.9rem; }
  .lp-feature-cards-inner { grid-template-columns: 1fr; }

  .lp-nuevos-grid  { grid-template-columns: repeat(2, 1fr); }
  .lp-otras-grid   { grid-template-columns: repeat(2, 1fr); }
  .lp-promo-section .lp-prod-card { flex: 0 0 calc(100% - 0px); }
  .lp-cd-box { padding: .7rem .9rem; min-width: 60px; }
  .lp-cd-num { font-size: 1.8rem; }
}
@media (max-width: 480px) {
  .lp-nuevos-grid { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
  .lp-otras-grid  { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
}

/* ══════════════════════════════════════════════════════
   RESPONSIVE — HAMBURGUESA (tablet) + NAV INFERIOR (móvil)
══════════════════════════════════════════════════════ */

/* ── Botón hamburguesa ──────────────────────────────── */
.lp-ham-btn {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  background: var(--verde-oscuro);
  border: none;
  border-radius: 10px;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
  transition: background .22s, transform .22s cubic-bezier(.34,1.56,.64,1);
}
.lp-ham-btn:hover { background: var(--cafe-oscuro); transform: scale(1.07); }
.lp-ham-btn:active { transform: scale(.92); }
.lp-ham-bar {
  display: block;
  width: 22px;
  height: 2.5px;
  background: #fff;
  border-radius: 3px;
  transform-origin: center;
  transition: transform .38s cubic-bezier(.34,1.56,.64,1),
              opacity   .25s ease,
              width     .3s  cubic-bezier(.34,1.56,.64,1);
}
.lp-ham-btn.open .lp-ham-bar:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.lp-ham-btn.open .lp-ham-bar:nth-child(2) { opacity: 0; transform: scaleX(0); }
.lp-ham-btn.open .lp-ham-bar:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }
.lp-ham-btn::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, rgba(255,255,255,.28) 0%, transparent 70%);
  opacity: 0;
  transform: scale(0);
  transition: opacity .3s, transform .45s;
}
.lp-ham-btn:active::after { opacity: 1; transform: scale(1); }

/* ── Overlay + Drawer ──────────────────────────────── */
.lp-drawer-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.5);
  z-index: 1050;
  opacity: 0;
  transition: opacity .3s;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
.lp-drawer-overlay.open { opacity: 1; }

.lp-drawer {
  position: fixed;
  top: 0; left: 0;
  width: 290px;
  max-width: 85vw;
  height: 100dvh;
  background: #fff;
  z-index: 1060;
  transform: translateX(-100%);
  transition: transform .38s cubic-bezier(.34,1.2,.64,1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 6px 0 40px rgba(0,0,0,.18);
}
.lp-drawer.open { transform: translateX(0); }

.lp-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.2rem;
  background: var(--verde-oscuro);
  flex-shrink: 0;
}
.lp-drawer-logo {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: .03em;
  line-height: 1;
  display: flex;
  align-items: center;
  gap: .25rem;
  text-decoration: none;
}
.lp-drawer-logo img { max-height: 42px; width: auto; object-fit: contain; filter: brightness(0) invert(1); }
.lp-drawer-close {
  width: 34px; height: 34px;
  border: 1.5px solid rgba(255,255,255,.4);
  background: transparent;
  color: #fff;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background .2s;
}
.lp-drawer-close:hover { background: rgba(255,255,255,.18); }

.lp-drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: .5rem 0 1.5rem;
}
.lp-drawer-nav-item {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .9rem 1.4rem;
  font-size: .85rem;
  font-weight: 700;
  color: var(--verde-oscuro);
  text-decoration: none;
  border-bottom: 1px solid #f0f3f0;
  letter-spacing: .06em;
  text-transform: uppercase;
  transition: background .15s, color .15s, padding-left .15s;
}
.lp-drawer-nav-item svg { width: 19px; height: 19px; flex-shrink: 0; }
.lp-drawer-nav-item:hover { background: var(--verde-soft); padding-left: 1.7rem; }
.lp-drawer-nav-item.active { color: var(--cafe-oscuro); background: var(--verde-soft); border-left: 3px solid var(--cafe-oscuro); }

.lp-drawer-section-title {
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #b0b8b0;
  padding: 1.1rem 1.4rem .4rem;
}
.lp-drawer-cat-item {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .58rem 1.4rem;
  font-size: .84rem;
  color: var(--texto);
  text-decoration: none;
  transition: background .15s, padding-left .15s;
}
.lp-drawer-cat-item:hover { background: var(--verde-soft); padding-left: 1.7rem; }
.lp-drawer-cat-item img { width: 26px; height: 26px; border-radius: 6px; object-fit: cover; }

.lp-drawer-footer {
  padding: 1rem 1.2rem;
  border-top: 1px solid #eee;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: .6rem;
}
.lp-drawer-wa {
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .65rem 1rem;
  background: #25D366;
  color: #fff;
  border-radius: 9px;
  font-size: .83rem;
  font-weight: 700;
  text-decoration: none;
  transition: background .2s, transform .15s;
}
.lp-drawer-wa:hover { background: #1da851; transform: scale(1.02); }
.lp-drawer-wa svg { width: 20px; height: 20px; flex-shrink: 0; }

/* ── Bottom Nav Bar (móvil) ────────────────────────── */
.lp-bottom-nav {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  height: 64px;
  background: #fff;
  border-top: 1.5px solid rgba(28,65,32,.12);
  z-index: 950;
  padding-bottom: env(safe-area-inset-bottom, 0);
  box-shadow: 0 -4px 24px rgba(0,0,0,.09);
}
.lp-bottom-nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-around;
  height: 100%;
  padding: 0 .25rem;
}
.lp-bn-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  flex: 1;
  height: 100%;
  color: #9ca3af;
  text-decoration: none;
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  border: none;
  background: transparent;
  cursor: pointer;
  padding: 0;
  position: relative;
  -webkit-tap-highlight-color: transparent;
  transition: color .18s, transform .18s;
}
.lp-bn-item svg { width: 22px; height: 22px; transition: transform .22s cubic-bezier(.34,1.56,.64,1); }
.lp-bn-item.active { color: var(--verde-oscuro); }
.lp-bn-item.active svg { transform: scale(1.15); }
.lp-bn-item:active { transform: scale(.88); }

/* Botón búsqueda central — destacado */
.lp-bn-search { color: #9ca3af !important; }
.lp-bn-search-bubble {
  width: 50px; height: 50px;
  border-radius: 50%;
  background: var(--verde-oscuro);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 18px rgba(28,65,32,.38);
  margin-top: -18px;
  transition: background .2s, transform .22s cubic-bezier(.34,1.56,.64,1);
}
.lp-bn-item.lp-bn-search:active .lp-bn-search-bubble { transform: scale(.88); }
.lp-bn-search-bubble svg { stroke: #fff !important; }

/* Badge carrito en bottom nav */
.lp-bn-cart-badge {
  position: absolute;
  top: 6px;
  right: calc(50% - 20px);
  background: var(--cafe-oscuro);
  color: #fff;
  font-size: .58rem;
  font-weight: 700;
  min-width: 16px; height: 16px;
  border-radius: 50%;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 0 3px;
  animation: lp-badge-pop .3s cubic-bezier(.34,1.56,.64,1);
}
@keyframes lp-badge-pop { from { transform: scale(0); } to { transform: scale(1); } }

/* ══ BREAKPOINTS ════════════════════════════════════ */

/* Tablet: 641px–1100px → hamburguesa */
@media (max-width: 1100px) {
  .lp-ham-btn { display: flex; }
  .lp-header nav { display: none; }
  .lp-whatsapp > div,
  .lp-login > div { display: none; }
  .lp-header {
    grid-template-columns: auto 1fr auto;
    padding: 0 1.5rem;
    height: 72px;
  }
  .lp-logo { justify-self: start; padding-right: 0; }
  .lp-actions { gap: .7rem; }

  /* Botón de login circular para tablet y móvil */
  .lp-login {
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: var(--verde-oscuro) !important;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #f0faf0;
    transition: background 0.2s, transform 0.15s;
  }
  .lp-login:hover {
    background: #e0f2e0;
    transform: scale(1.05);
  }
  .lp-login svg {
    width: 20px;
    height: 20px;
    stroke: var(--verde-oscuro);
  }
}

/* Móvil: ≤ 640px → nav inferior */
@media (max-width: 640px) {
  .lp-bottom-nav { display: block; }
  body { padding-bottom: 66px; }
  .lp-ham-btn { display: none; }
  .lp-header {
    grid-template-columns: auto 1fr auto;
    padding: 0 1rem;
    height: 58px;
  }
  .lp-logo-img { max-height: 44px; }
  .lp-actions { gap: .4rem; }
  .lp-whatsapp { display: none !important; }
  .lp-search-btn { display: none; }
  .lp-cart { padding: .38rem .6rem; font-size: .8rem; border-radius: 7px; }
  .lp-cart-label { display: none; }
}

/* ═══════════════════════════════════════════════════════════════
   MODO OSCURO — data-theme="dark" en <html>
   ═══════════════════════════════════════════════════════════════ */

/* Variables reasignadas */
[data-theme="dark"] {
  --texto:      #e4ede4;
  --gris-suave: #111c12;
  --verde-soft: #111c12;
  --cafe-soft:  #1a1510;
  --crema:      #172318;
  color-scheme: dark;
}

/* ── Body ─────────────────────────────────────────────── */
[data-theme="dark"] body { background: #0f1a10; color: #e4ede4; }

/* ── Header ───────────────────────────────────────────── */
[data-theme="dark"] .lp-header { background: #0d1a0e; border-bottom-color: rgba(255,255,255,.07); }
[data-theme="dark"] .lp-nav li a { color: #c8dcc8; }
[data-theme="dark"] .lp-nav > li > a:hover,
[data-theme="dark"] .lp-nav > li > a.active { color: var(--cafe-claro); }
[data-theme="dark"] .lp-search-btn { color: #c8dcc8; }
[data-theme="dark"] .lp-whatsapp { color: #c8dcc8; }
[data-theme="dark"] .lp-whatsapp small { color: #5a706a; }
[data-theme="dark"] .lp-login { color: #c8dcc8; }
[data-theme="dark"] .lp-login small { color: #5a706a; }
@media (max-width: 1100px) {
  [data-theme="dark"] .lp-login {
    background: #172318 !important;
    color: #c8dcc8 !important;
  }
  [data-theme="dark"] .lp-login svg {
    stroke: #c8dcc8 !important;
  }
  [data-theme="dark"] .lp-login:hover {
    background: #243c26 !important;
  }
}

/* ── Mega menú ────────────────────────────────────────── */
[data-theme="dark"] .lp-mega { background: #1c2d1e; box-shadow: 0 20px 60px rgba(0,0,0,.55); }
[data-theme="dark"] .lp-mega-prod:hover { background: #243c26; }
[data-theme="dark"] .lp-mega-prod-img { background: #1a2b1b; }
[data-theme="dark"] .lp-mega-prod-name { color: #c8dcc8; }
[data-theme="dark"] .lp-mega-prods-title,
[data-theme="dark"] .lp-mega-empty { color: #5a706a; }
[data-theme="dark"] .lp-mega-ver-todo { color: var(--cafe-claro); }

/* ── Buscador AJAX overlay ────────────────────────────── */
[data-theme="dark"] .lp-search-box { background: #1c2d1e; }
[data-theme="dark"] .lp-search-input-row { border-bottom-color: rgba(255,255,255,.07); }
[data-theme="dark"] .lp-search-input { color: #e4ede4; }
[data-theme="dark"] .lp-search-input::placeholder { color: #3a5040; }
[data-theme="dark"] .lp-search-close { background: #243c26; color: #c8dcc8; }
[data-theme="dark"] .lp-search-close:hover { background: #2e4e30; color: #e4ede4; }
[data-theme="dark"] .lp-search-hint { color: #5a706a; }
[data-theme="dark"] .lp-search-count { color: #5a706a; }
[data-theme="dark"] .lp-search-card { background: #172318; border-color: rgba(255,255,255,.07); }
[data-theme="dark"] .lp-search-card-img { background: #1a2b1b; }
[data-theme="dark"] .lp-search-card-img--empty,
[data-theme="dark"] .lp-search-card-noimg { background: #1a2b1b; color: #3a5040; }
[data-theme="dark"] .lp-search-card-cat { background: #2a1f12; color: var(--cafe-claro); }
[data-theme="dark"] .lp-search-card-name { color: #c8dcc8; }
[data-theme="dark"] .lp-search-card-price-old { color: #5a706a; }
[data-theme="dark"] .lp-search-spinner { color: #5a706a; }
[data-theme="dark"] .lp-search-spinner::before { border-color: rgba(255,255,255,.08); border-top-color: var(--cafe-claro); }
[data-theme="dark"] .lp-search-empty { color: #5a706a; }
[data-theme="dark"] .lp-search-empty strong { color: #c8dcc8; }

/* ── Categorías carousel ──────────────────────────────── */
[data-theme="dark"] .lp-cats { background: #0f1a10; }
[data-theme="dark"] .lp-cat-card { background: #172318; border-color: rgba(200,169,110,.3); }

/* ── Feature cards (home) ─────────────────────────────── */
[data-theme="dark"] .lp-feature-cards { background: #111c12; }
[data-theme="dark"] .lp-fc-card { background: #172318; }
[data-theme="dark"] .lp-fc-verde .lp-fc-left,
[data-theme="dark"] .lp-fc-cafe  .lp-fc-left { background: #1c2d1e; }
[data-theme="dark"] .lp-fc-desc { color: #8fa48f; }

/* ── Somos ─────────────────────────────────────────────── */
[data-theme="dark"] .lp-somos { background: #111c12; }

/* ── Secciones productos ──────────────────────────────── */
[data-theme="dark"] .lp-prods-verde { background: #0f1a10; }
[data-theme="dark"] .lp-prods-cafe  { background: #111510; }
[data-theme="dark"] .lp-prod-card { background: #172318; }
[data-theme="dark"] .lp-prod-img-wrap,
[data-theme="dark"] .lp-prod-img-placeholder { background: #1a2b1b; }
[data-theme="dark"] .lp-prod-name { color: #e4ede4; }
[data-theme="dark"] .lp-prod-price { color: #e4ede4; }
[data-theme="dark"] .lp-prod-delivery { color: #5a706a; }
[data-theme="dark"] .lp-prod-badge { background: #1c2d1e; }
[data-theme="dark"] .lp-prods-arrow { background: #172318; border-color: rgba(255,255,255,.1); }

/* ── Pack cards ───────────────────────────────────────── */
[data-theme="dark"] .lp-pack-card { background: #172318; }
[data-theme="dark"] .lp-pack-name,
[data-theme="dark"] .lp-pack-price { color: #e4ede4; }
[data-theme="dark"] .lp-pack-desc { color: #5a706a; }
[data-theme="dark"] .lp-pack-desc::after { background: linear-gradient(to bottom, transparent, #172318); }

/* ── Info cards ───────────────────────────────────────── */
[data-theme="dark"] .lp-info-cards { background: #111c12; }
[data-theme="dark"] .lp-info-card { background: #172318; }

/* ── Reseñas ──────────────────────────────────────────── */
[data-theme="dark"] .lp-reviews { background: #111c12; }
[data-theme="dark"] .lp-reviews-title { color: #e4ede4; }

/* ── Nosotros ─────────────────────────────────────────── */
[data-theme="dark"] .lp-nos-historia { background: #0f1a10; }
[data-theme="dark"] .lp-nos-hist-desc { color: #8fa48f; }
[data-theme="dark"] .lp-nos-datos { background: #111c12; }
[data-theme="dark"] .lp-nos-datos-desc { color: #8fa48f; }
[data-theme="dark"] .lp-nos-datos-desc strong,
[data-theme="dark"] .lp-nos-datos-desc b { color: #e4ede4; }
[data-theme="dark"] .lp-nos-datos-card { background: #172318; }
[data-theme="dark"] .lp-nos-datos-card-desc { color: #8fa48f; }
[data-theme="dark"] .lp-nos-ubicacion { background: #1c2d1e; }
[data-theme="dark"] .lp-nos-ubicacion-desc { color: #8fa48f; }
[data-theme="dark"] .lp-nos-valores { background: #111c12; }
[data-theme="dark"] .lp-nos-val-card { background: #172318; }
[data-theme="dark"] .lp-nos-val-desc { color: #8fa48f; }
[data-theme="dark"] .lp-nos-equipo { background: #111c12; }
[data-theme="dark"] .lp-nos-eq-card { background: #172318; }
[data-theme="dark"] .lp-nos-eq-photo { background: #1c2d1e; }
[data-theme="dark"] .lp-nos-eq-puesto { color: #5a706a; }
[data-theme="dark"] .lp-nos-eq-social { background: #1c2d1e; }
[data-theme="dark"] .lp-nos-timeline { background: #0f1a10; }
[data-theme="dark"] .lp-nos-tl-card { background: #172318; border-color: rgba(255,255,255,.08); }
[data-theme="dark"] .lp-nos-tl-desc { color: #8fa48f; }
[data-theme="dark"] .lp-nos-tl-dot { border-color: #0f1a10; }

/* ── Tienda (catálogo) ────────────────────────────────── */
[data-theme="dark"] .lp-shop-searchbar-wrap { background: #1a2b1b; }
[data-theme="dark"] .lp-shop-searchbar-input { color: #e4ede4; }
[data-theme="dark"] .lp-shop-searchbar-input::placeholder { color: #3a5040; }
[data-theme="dark"] .lp-shop-searchbar-icon { color: #5a706a; }
[data-theme="dark"] .lp-shop-sidebar-section { background: #172318; border-color: rgba(255,255,255,.07); }
[data-theme="dark"] .lp-shop-sidebar-title { color: #5a706a; }
[data-theme="dark"] .lp-shop-cat-link { color: #c8dcc8; }
[data-theme="dark"] .lp-shop-cat-link:hover { background: #1c2d1e; color: var(--cafe-claro); }
[data-theme="dark"] .lp-shop-cat-count { background: #1c2d1e; color: var(--cafe-claro); }
[data-theme="dark"] .lp-shop-order-link { color: #8fa48f; }
[data-theme="dark"] .lp-shop-order-link:hover { background: #1c2d1e; }
[data-theme="dark"] .lp-shop-active-tag { background: #2a1f12; color: var(--cafe-claro); }
[data-theme="dark"] .lp-shop-results-info { color: #8fa48f; }
[data-theme="dark"] .lp-shop-perpage,
[data-theme="dark"] .lp-shop-view-toggle { background: #1c2d1e; }
[data-theme="dark"] .lp-shop-pp-btn,
[data-theme="dark"] .lp-shop-view-btn { color: #5a706a; }
[data-theme="dark"] .lp-shop-pp-btn:hover,
[data-theme="dark"] .lp-shop-view-btn:hover { background: #243c26; color: #c8dcc8; }
[data-theme="dark"] .lp-shop-card { background: #172318; border-color: rgba(255,255,255,.07); }
[data-theme="dark"] .lp-shop-card-img-bg { background: #1a2b1b; }
[data-theme="dark"] .lp-shop-card-noimg { color: rgba(255,255,255,.1); }
[data-theme="dark"] .lp-shop-card-name { color: #c8dcc8; }
[data-theme="dark"] .lp-shop-card-weight,
[data-theme="dark"] .lp-shop-card-delivery { color: #5a706a; }
[data-theme="dark"] .lp-shop-card-desc { color: #8fa48f; }
[data-theme="dark"] .lp-shop-price-old { color: #5a706a; }
[data-theme="dark"] .lp-shop-page-btn { background: #172318; border-color: rgba(255,255,255,.1); color: #c8dcc8; }
[data-theme="dark"] .lp-shop-page-btn:hover { background: #1c2d1e; border-color: rgba(255,255,255,.2); }
[data-theme="dark"] .lp-shop-sort-select { background: #172318; color: #c8dcc8; border-color: rgba(255,255,255,.1); }
[data-theme="dark"] .lp-shop-empty svg { color: #3a5040; }
[data-theme="dark"] .lp-shop-empty p { color: #5a706a; }

/* ── Promociones ──────────────────────────────────────── */
[data-theme="dark"] .lp-countdown-section { background: #111c12; border-bottom-color: rgba(255,255,255,.06); }
[data-theme="dark"] .lp-promo-section:nth-child(even) { background: #111c12; }
[data-theme="dark"] .lp-nuevos-section { background: #0f1a10; }
[data-theme="dark"] .lp-otras-section { background: #111c12; }
[data-theme="dark"] .lp-otras-tab { background: #172318; border-color: rgba(255,255,255,.1); color: #8fa48f; }
[data-theme="dark"] .lp-otras-tab:hover { border-color: var(--verde-oscuro); color: #c8dcc8; }
[data-theme="dark"] .lp-cupones-section { background: #111c12; }
[data-theme="dark"] .lp-cupones-sub { color: #8fa48f; }
[data-theme="dark"] .lp-cupon-card { background: #172318; border-color: rgba(255,255,255,.08); }
[data-theme="dark"] .lp-cupon-desc { color: #8fa48f; }
[data-theme="dark"] .lp-cupon-code { background: #2a1f12; color: var(--cafe-claro); }
[data-theme="dark"] .lp-cupon-copy { background: #1c2d1e; color: #c8dcc8; }
[data-theme="dark"] .lp-promo-empty { color: #5a706a; }
[data-theme="dark"] .lp-feature-card { background: #172318; } /* promo feature cards (no brand-colored ones) */

/* ── Drawer (menú móvil) ──────────────────────────────── */
[data-theme="dark"] .lp-drawer { background: #0f1a10; }
[data-theme="dark"] .lp-drawer-body { background: #0f1a10; }
[data-theme="dark"] .lp-drawer-nav-item { color: #c8dcc8; border-bottom-color: rgba(255,255,255,.06); }
[data-theme="dark"] .lp-drawer-nav-item:hover { background: #172318; }
[data-theme="dark"] .lp-drawer-nav-item.active { background: #172318; }
[data-theme="dark"] .lp-drawer-section-title { color: #3a5040; }
[data-theme="dark"] .lp-drawer-cat-item { color: #c8dcc8; }
[data-theme="dark"] .lp-drawer-cat-item:hover { background: #172318; }
[data-theme="dark"] .lp-drawer-footer { border-top-color: rgba(255,255,255,.06); }

/* ── Bottom nav (móvil) ───────────────────────────────── */
[data-theme="dark"] .lp-bottom-nav { background: #0d1a0e; border-top-color: rgba(255,255,255,.07); }
[data-theme="dark"] .lp-bn-item { color: #3a5040; }
[data-theme="dark"] .lp-bn-item.active { color: var(--cafe-claro); }

/* ── Botón toggle modo día/noche ──────────────────────── */
.lp-theme-toggle {
  position: fixed;
  bottom: 5.5rem;
  right: 1.2rem;
  z-index: 940;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--verde-oscuro);
  color: #fff;
  border: 2px solid rgba(255,255,255,.2);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 18px rgba(0,0,0,.28);
  transition: background .25s, transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .25s;
}
.lp-theme-toggle:hover {
  background: var(--cafe-oscuro);
  transform: scale(1.12) rotate(22deg);
  box-shadow: 0 6px 24px rgba(0,0,0,.38);
}
.lp-theme-toggle svg { width: 20px; height: 20px; flex-shrink: 0; }
@media (max-width: 640px) {
  .lp-theme-toggle { bottom: 5rem; right: .75rem; width: 40px; height: 40px; }
}