*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f7f7f7;color:#181818;padding-bottom:86px}body.modal-open{overflow:hidden}.topbar{display:flex;justify-content:space-between;align-items:center;padding:16px 7%;background:#fff;box-shadow:0 2px 16px rgba(0,0,0,.06);position:sticky;top:0;z-index:10}.brand{font-weight:800;letter-spacing:1px}.trust{font-size:14px;color:#444}.hero{display:grid;grid-template-columns:1fr 1fr;gap:42px;padding:48px 7%;align-items:center;background:linear-gradient(135deg,#fff,#eef5ff)}.hero-image-wrap{background:#fff;border-radius:28px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.08)}.hero-image{width:100%;display:block}.badge{display:inline-block;background:#111;color:#fff;padding:8px 14px;border-radius:999px;font-size:14px;margin-bottom:14px}h1{font-size:clamp(34px,5vw,62px);line-height:1.02;margin:0 0 14px}.hero-content p{font-size:20px;color:#555}.rating{margin:18px 0;font-weight:700}.rating span{color:#555;font-weight:400}.price-box{display:flex;align-items:end;gap:14px;margin:18px 0 8px}.price{font-size:42px;font-weight:900}.compare-price{font-size:20px;text-decoration:line-through;color:#999}.stock{color:#107c41!important;font-weight:700}.primary-btn,button[type=submit]{display:inline-block;text-align:center;border:none;background:#111;color:#fff;padding:18px 24px;border-radius:14px;font-size:18px;font-weight:800;cursor:pointer;text-decoration:none;margin:18px 0}.mini-benefits{display:flex;flex-wrap:wrap;gap:10px}.mini-benefits span{background:#fff;padding:10px 12px;border-radius:999px;box-shadow:0 4px 14px rgba(0,0,0,.06)}.benefits-section,.urgency,.faq{padding:44px 7%;text-align:center}.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:24px}.benefit-card{background:#fff;border-radius:20px;padding:24px;box-shadow:0 10px 28px rgba(0,0,0,.06);font-weight:700}.urgency{background:#111;color:#fff}.urgency p{color:#f3f3f3}.timer{display:flex;justify-content:center;gap:10px;align-items:baseline}.timer span{background:#fff;color:#111;padding:12px 16px;border-radius:10px;font-size:24px;font-weight:900}.timer small{margin-right:8px}.faq{text-align:left;max-width:900px;margin:auto}.faq h2{text-align:center}details{background:#fff;margin:12px 0;border-radius:16px;padding:18px;box-shadow:0 8px 22px rgba(0,0,0,.05)}summary{cursor:pointer;font-weight:800}footer{padding:28px;text-align:center;background:#111;color:#fff}.sticky-buy{position:fixed;left:0;right:0;bottom:0;background:#fff;box-shadow:0 -8px 30px rgba(0,0,0,.14);padding:12px 7%;display:flex;justify-content:space-between;align-items:center;gap:12px;z-index:30}.sticky-buy strong{display:block}.sticky-buy span{font-weight:900;color:#111}.sticky-buy button{background:#10a000;color:#fff;border:0;border-radius:12px;padding:14px 20px;font-weight:900;font-size:16px;cursor:pointer}.checkout-modal{position:fixed;inset:0;z-index:100;display:none}.checkout-modal.active{display:block}.checkout-overlay{position:absolute;inset:0;background:rgba(0,0,0,.56)}.checkout-dialog{position:relative;max-width:820px;margin:24px auto;background:#fff;border-radius:22px;padding:30px;max-height:calc(100vh - 48px);overflow:auto;box-shadow:0 24px 80px rgba(0,0,0,.3)}.modal-close{position:absolute;right:24px;top:18px;background:transparent;border:0;font-size:46px;line-height:1;color:#555;cursor:pointer}.checkout-dialog h2{text-align:center;font-size:32px;margin:0 0 22px}.option-card{display:grid;grid-template-columns:84px 1fr auto;gap:14px;align-items:center;border:2px solid #ddd;border-radius:10px;padding:12px}.option-card.active{border-color:#27313f;box-shadow:0 0 0 2px rgba(39,49,63,.08)}.option-card img{width:84px;height:84px;object-fit:cover;border-radius:10px;background:#eee}.option-card strong{display:block;font-size:22px}.option-badge{display:inline-block;background:#ef233c;color:#fff;padding:8px 12px;border-radius:8px;margin-top:8px;font-weight:800}.option-price{font-size:24px;font-weight:900;text-align:right}.checkout-totals{border-top:1px solid #ddd;border-bottom:1px solid #ddd;margin:20px 0;padding:12px 0}.checkout-totals div{display:flex;justify-content:space-between;padding:8px 0;font-size:19px}.checkout-totals .total-line{font-size:25px;font-weight:900}.popup-form label{font-size:20px;font-weight:900;margin:0}.popup-form label b{color:#e60012}.form-grid{display:grid;grid-template-columns:160px 1fr;gap:16px 18px;align-items:center}.input-icon{display:flex;border:1px solid #bbb;border-radius:8px;overflow:hidden;background:#fff}.input-icon span{width:66px;display:flex;align-items:center;justify-content:center;background:#e6e6e6;font-size:24px}.input-icon input,.form-grid select{width:100%;border:1px solid #bbb;border-radius:8px;padding:18px 20px;font-size:20px}.input-icon input{border:0;border-left:1px solid #bbb;border-radius:0}.form-grid select{background:#2b2b2b;color:#fff}.address-warning{grid-column:1/-1;text-align:center;color:#d32f2f;font-weight:900;font-size:24px;line-height:1.2;padding:18px 8px}.secure-shipping{text-align:center;margin:24px 0 12px}.secure-shipping small{display:block;font-weight:800;margin-bottom:12px}.secure-shipping strong{font-size:24px;letter-spacing:12px}.pay-btn{width:100%;background:#10a000!important;color:#fff!important;border-radius:6px!important;margin:16px 0 8px!important;font-size:24px!important;line-height:1.25!important}.pay-note{text-align:center;text-transform:uppercase;font-weight:800;color:#fff;background:#10a000;margin:0;padding:0 12px 18px;border-radius:0 0 6px 6px}.form-message{font-weight:800;text-align:center}.form-message.success{color:#107c41}.form-message.error{color:#b00020}@media(max-width:820px){.topbar{padding:14px 5%;align-items:flex-start;gap:8px;flex-direction:column}.hero{grid-template-columns:1fr;padding:28px 5%}.benefit-grid{grid-template-columns:1fr 1fr}.primary-btn{width:100%}.checkout-dialog{margin:0;min-height:100vh;border-radius:0;padding:22px 18px}.form-grid{grid-template-columns:1fr;gap:8px}.popup-form label{font-size:17px}.address-warning{font-size:19px}.option-card{grid-template-columns:70px 1fr}.option-price{grid-column:1/-1;text-align:right}.sticky-buy{padding:10px 5%}.sticky-buy button{padding:13px 14px}}@media(max-width:520px){.benefit-grid{grid-template-columns:1fr}.price{font-size:34px}.checkout-dialog h2{font-size:28px}}
.checkout-modal{overflow-y:auto;padding:30px 0;}
.checkout-dialog{max-width:980px;border-radius:32px;max-height:none;overflow:visible;padding:40px;}
.modal-close{top:22px;right:22px;font-size:56px;}
.shipping-box{border:1px solid #ddd;border-radius:16px;padding:18px;margin:18px 0 24px;}
.shipping-option{display:flex;justify-content:space-between;align-items:center;font-size:22px;}
.shipping-option-left{display:flex;align-items:center;gap:12px;}
.trust-logos{text-align:center;margin:25px 0;font-weight:700;color:#444;}
.pay-btn{border-radius:14px!important;font-size:28px!important;padding:22px!important;}


/* ============================================================
   PREMIUM V3 - Modal tipo checkout pro
   Fondo congelado + scroll en overlay + popup redondeado
   ============================================================ */

body.modal-open{
  overflow:hidden;
}

.checkout-modal{
  position:fixed;
  inset:0;
  z-index:1000;
  display:none;
  overflow-y:auto;
  padding:54px 18px;
  -webkit-overflow-scrolling:touch;
}

.checkout-modal.active{
  display:block;
}

.checkout-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.58);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}

.checkout-dialog{
  position:relative;
  z-index:2;
  width:min(980px,100%);
  max-width:980px;
  margin:0 auto 54px;
  background:#fff;
  border-radius:34px;
  padding:42px;
  max-height:none;
  overflow:visible;
  box-shadow:0 32px 100px rgba(0,0,0,.34);
}

.modal-close{
  position:absolute;
  top:20px;
  right:24px;
  width:52px;
  height:52px;
  border-radius:50%;
  background:#f2f2f2;
  border:1px solid #e3e3e3;
  color:#333;
  font-size:42px;
  line-height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:transform .18s ease, background .18s ease;
}

.modal-close:hover{
  transform:scale(1.04);
  background:#e9e9e9;
}

.checkout-dialog h2{
  font-size:36px;
  margin-bottom:28px;
}

.option-card{
  border-radius:22px;
  padding:18px;
  border:2px solid #1f2937;
  background:linear-gradient(180deg,#fff,#fbfbfb);
}

.option-card img{
  border-radius:18px;
}

.option-badge{
  border-radius:999px;
}

.checkout-totals{
  border:0;
  background:#f8fafc;
  border-radius:20px;
  padding:18px 22px;
}

.shipping-box{
  border:2px solid #e7e7e7;
  border-radius:22px;
  padding:22px;
  background:#fff;
  box-shadow:0 10px 26px rgba(0,0,0,.04);
}

.shipping-box h3{
  margin:0 0 14px;
  font-size:24px;
}

.shipping-option{
  border:2px solid #111;
  border-radius:18px;
  padding:16px 18px;
  background:#f9fff9;
}

.shipping-option input{
  width:22px;
  height:22px;
  accent-color:#0fa000;
}

.form-grid{
  gap:18px 20px;
}

.input-icon{
  border-radius:14px;
}

.input-icon span{
  border-radius:14px 0 0 14px;
}

.input-icon input,
.form-grid select{
  border-radius:14px;
}

.address-warning{
  border-radius:18px;
  background:#fff4f4;
  border:1px solid #ffd1d1;
}

.trust-logos{
  border-radius:18px;
  background:#f7f7f7;
  padding:16px;
}

.pay-btn{
  border-radius:18px!important;
  font-size:30px!important;
  padding:24px!important;
  box-shadow:0 12px 28px rgba(16,160,0,.28);
}

.pay-note{
  border-radius:0 0 18px 18px;
}

@media(max-width:820px){
  .checkout-modal{
    padding:18px 10px 90px;
  }

  .checkout-dialog{
    width:100%;
    margin:0 auto 40px;
    border-radius:30px;
    padding:24px 18px;
    min-height:auto;
  }

  .modal-close{
    top:14px;
    right:14px;
    width:46px;
    height:46px;
    font-size:38px;
  }

  .checkout-dialog h2{
    padding-right:52px;
    font-size:30px;
  }

  .option-card{
    border-radius:20px;
    grid-template-columns:72px 1fr;
  }

  .shipping-option{
    font-size:18px;
  }

  .pay-btn{
    font-size:22px!important;
    padding:20px!important;
  }
}


/* ============================================================
   AJUSTE SOLICITADO - Bloque verde final tipo referencia
   Solo modifica botón de pago + texto inferior
   ============================================================ */

.pay-btn{
  width:100%!important;
  background:#10a000!important;
  color:#fff!important;
  border:0!important;
  border-radius:8px 8px 0 0!important;
  margin:18px 0 0!important;
  padding:24px 18px 12px!important;
  font-size:26px!important;
  line-height:1.15!important;
  font-weight:900!important;
  box-shadow:0 8px 18px rgba(16,160,0,.22)!important;
}

.pay-note{
  width:100%!important;
  background:#10a000!important;
  color:#fff!important;
  margin:0 0 26px!important;
  padding:0 18px 24px!important;
  border-radius:0 0 8px 8px!important;
  text-align:center!important;
  text-transform:uppercase!important;
  font-size:23px!important;
  line-height:1.22!important;
  font-weight:700!important;
  box-shadow:0 8px 18px rgba(16,160,0,.22)!important;
}

@media(max-width:820px){
  .pay-btn{
    font-size:21px!important;
    padding:20px 12px 10px!important;
  }

  .pay-note{
    font-size:17px!important;
    padding:0 12px 20px!important;
  }
}


/* ============================================================
   AJUSTE PAQUETES / DESCUENTOS
   Solo agrega presentación para 1, 2 y 3 unidades
   ============================================================ */

.package-options{
  display:grid;
  gap:18px;
  margin-bottom:20px;
}

.package-card{
  width:100%;
  text-align:left;
  background:#fff;
  cursor:pointer;
  color:#181818;
  margin:0;
  font-family:inherit;
}

.package-card.active{
  border-color:#1f2937!important;
  background:#f5f7fb!important;
  box-shadow:0 0 0 2px rgba(31,41,55,.08)!important;
}

.option-badge.neutral{
  background:#6b7280;
}

.option-badge.green{
  background:#10a000;
}

.old-price{
  display:block;
  text-decoration:line-through;
  color:#111;
  opacity:.85;
  font-size:18px;
}

.discount-line strong{
  color:#e00000;
}

@media(max-width:820px){
  .package-options{
    gap:14px;
  }

  .package-card strong{
    font-size:18px;
  }

  .old-price{
    font-size:16px;
  }
}


/* ============================================================
   AJUSTE SOLICITADO - Botón verde más llamativo
   Solo agrega efecto visual al botón de compra
   ============================================================ */

.pay-btn{
  position:relative!important;
  overflow:hidden!important;
  cursor:pointer!important;
  animation:arkPulseGreen 1.8s infinite!important;
  transition:transform .18s ease, filter .18s ease!important;
}

.pay-btn::before{
  content:"";
  position:absolute;
  top:0;
  left:-120%;
  width:70%;
  height:100%;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.45), transparent);
  transform:skewX(-20deg);
  animation:arkShineButton 2.6s infinite;
}

.pay-btn::after{
  content:" ➜";
  display:inline-block;
  margin-left:8px;
  animation:arkArrowMove .8s infinite alternate;
}

.pay-btn:hover{
  filter:brightness(1.08)!important;
  transform:translateY(-2px) scale(1.01)!important;
}

.pay-btn:active{
  transform:scale(.98)!important;
}

@keyframes arkPulseGreen{
  0%{
    box-shadow:0 8px 18px rgba(16,160,0,.22), 0 0 0 0 rgba(16,160,0,.45);
  }
  70%{
    box-shadow:0 8px 18px rgba(16,160,0,.22), 0 0 0 18px rgba(16,160,0,0);
  }
  100%{
    box-shadow:0 8px 18px rgba(16,160,0,.22), 0 0 0 0 rgba(16,160,0,0);
  }
}

@keyframes arkShineButton{
  0%{left:-120%;}
  45%{left:130%;}
  100%{left:130%;}
}

@keyframes arkArrowMove{
  from{transform:translateX(0);}
  to{transform:translateX(7px);}
}

@media (prefers-reduced-motion: reduce){
  .pay-btn,
  .pay-btn::before,
  .pay-btn::after{
    animation:none!important;
  }
}


/* ============================================================
   RESALTAR MUCHO MÁS EL PAQUETE SELECCIONADO
   No elimina nada existente
   ============================================================ */

.package-card{
  transition:all .25s ease;
}

.package-card:hover{
  transform:translateY(-2px);
}

.package-card.active{
  border:4px solid #10a000 !important;
  background:linear-gradient(180deg,#f4fff4,#e8ffe8) !important;
  box-shadow:
    0 0 0 4px rgba(16,160,0,.18),
    0 0 28px rgba(16,160,0,.35),
    0 10px 30px rgba(0,0,0,.10) !important;
  transform:scale(1.015);
  position:relative;
}

.package-card.active::after{
  content:"✓ SELECCIONADO";
  position:absolute;
  top:12px;
  right:12px;
  background:#10a000;
  color:#fff;
  font-weight:900;
  font-size:13px;
  padding:6px 10px;
  border-radius:999px;
  letter-spacing:.5px;
}

.package-card.active .option-price{
  color:#10a000;
  font-size:28px;
}

.package-card.active strong{
  color:#0a5f00;
}

@media(max-width:820px){
  .package-card.active::after{
    font-size:11px;
    padding:5px 8px;
  }
}


/* ============================================================
   AJUSTE FINAL RESPONSIVE - Paquete seleccionado
   Mantiene toda la lógica y solo mejora visual/adaptación
   ============================================================ */

/* Reserva espacio real para la etiqueta sin tapar precios */
.package-card.active{
  position:relative;
  overflow:visible;
}

.package-card.active::after{
  content:"✓ SELECCIONADO";
  position:absolute;
  top:10px;
  right:16px;
  background:#10a000;
  color:#fff;
  font-weight:900;
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  letter-spacing:.4px;
  z-index:5;
  white-space:nowrap;
}

/* En escritorio, baja un poco el bloque de precio del seleccionado */
.package-card.active .option-price{
  color:#10a000;
  font-size:28px;
  padding-top:34px;
  min-width:150px;
}

/* Evita que los textos largos empujen o rompan el precio */
.package-card > div:nth-child(2){
  min-width:0;
}

.package-card > div:nth-child(2) strong{
  overflow-wrap:anywhere;
}

/* Mejor adaptación general en tablets */
@media(max-width:900px){
  .checkout-dialog{
    width:calc(100% - 20px)!important;
    padding:26px 18px!important;
  }

  .package-card{
    grid-template-columns:76px 1fr auto!important;
    gap:12px!important;
    padding:16px!important;
  }

  .package-card img{
    width:76px!important;
    height:76px!important;
  }

  .package-card strong{
    font-size:19px!important;
    line-height:1.18!important;
  }

  .option-price{
    font-size:22px!important;
    min-width:128px;
  }

  .old-price{
    font-size:15px!important;
  }
}

/* Móvil: etiqueta debajo del texto, no encima del precio */
@media(max-width:640px){
  .checkout-modal{
    padding:10px 8px 90px!important;
  }

  .checkout-dialog{
    border-radius:24px!important;
    padding:20px 14px!important;
  }

  .checkout-dialog h2{
    font-size:26px!important;
    padding-right:46px!important;
  }

  .package-card,
  .package-card.active{
    grid-template-columns:68px 1fr!important;
    gap:12px!important;
    padding:14px!important;
    transform:none!important;
  }

  .package-card img{
    width:68px!important;
    height:68px!important;
  }

  .package-card .option-price{
    grid-column:1 / -1;
    text-align:right;
    width:100%;
    min-width:0;
    padding-top:0!important;
    margin-top:4px;
    font-size:24px!important;
  }

  .package-card.active .option-price{
    padding-top:0!important;
    font-size:25px!important;
  }

  .package-card.active::after{
    position:static;
    grid-column:1 / -1;
    justify-self:start;
    margin-top:6px;
    font-size:11px;
    padding:5px 9px;
  }

  .package-card strong{
    font-size:17px!important;
    line-height:1.15!important;
  }

  .option-badge{
    font-size:12px!important;
    padding:6px 9px!important;
  }

  .old-price{
    font-size:15px!important;
  }

  .checkout-totals{
    padding:14px!important;
  }

  .checkout-totals div{
    font-size:17px!important;
  }

  .checkout-totals .total-line{
    font-size:22px!important;
  }

  .shipping-option{
    font-size:17px!important;
    padding:14px!important;
  }

  .pay-btn{
    font-size:19px!important;
    padding:18px 10px 10px!important;
  }

  .pay-note{
    font-size:15px!important;
    padding:0 10px 18px!important;
  }
}

/* Móvil muy pequeño */
@media(max-width:390px){
  .package-card,
  .package-card.active{
    grid-template-columns:58px 1fr!important;
    padding:12px!important;
  }

  .package-card img{
    width:58px!important;
    height:58px!important;
  }

  .package-card strong{
    font-size:15px!important;
  }

  .package-card .option-price,
  .package-card.active .option-price{
    font-size:22px!important;
  }

  .pay-btn{
    font-size:17px!important;
  }
}


/* ============================================================
   LUMARA PREMIUM PACK SELECTOR - Diseño tipo referencia
   ============================================================ */

:root{
  --lumara-green:#7a8b45;
  --lumara-green-dark:#526333;
  --lumara-light:#e5eddd;
  --lumara-soft:#f4faed;
  --lumara-neon:#bbed39;
  --lumara-border:#dfe8d6;
}

.brand{
  color:#111;
}

.checkout-dialog{
  max-width:930px!important;
  border-radius:30px!important;
  background:#fff!important;
}

.lumara-invima-card{
  display:flex;
  align-items:center;
  gap:22px;
  margin:10px auto 34px;
  padding:22px 28px;
  max-width:780px;
  border-radius:24px;
  background:#f5faee;
  border:1px solid #d9e7cd;
  box-shadow:0 18px 45px rgba(90,111,58,.08);
}

.lumara-invima-icon{
  width:58px;
  height:58px;
  min-width:58px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--lumara-neon);
  color:#111;
  font-size:34px;
  font-weight:900;
}

.lumara-invima-card span{
  display:block;
  color:#698044;
  font-weight:900;
  text-transform:none;
}

.lumara-invima-card strong{
  display:block;
  color:#111;
  font-size:24px;
  line-height:1.1;
}

.lumara-invima-card p{
  margin:4px 0 0;
  color:#53604a;
  font-size:17px;
}

.lumara-pack-steps{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin:18px 0 26px;
  padding:28px 0 0;
}

.lumara-progress-track{
  position:absolute;
  top:54px;
  left:7%;
  right:7%;
  height:3px;
  background:#e8e8e8;
  overflow:hidden;
  z-index:1;
}

.lumara-progress-track span{
  display:block;
  width:0;
  height:100%;
  background:var(--lumara-green-dark);
  transition:width .25s ease;
}

.lumara-step{
  position:relative;
  z-index:2;
  appearance:none;
  border:0;
  background:transparent;
  margin:0;
  padding:0 4px;
  color:#222;
  font-family:inherit;
  cursor:pointer;
  text-align:center;
}

.lumara-step-circle{
  width:66px;
  height:66px;
  margin:0 auto 9px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:#d4e5c7;
  border:5px solid #fff;
  box-shadow:0 10px 26px rgba(0,0,0,.08);
  font-weight:900;
  font-size:34px;
  transition:all .22s ease;
}

.lumara-step.active .lumara-step-circle,
.lumara-step.completed .lumara-step-circle{
  background:#cfe2c1;
  color:#fff;
}

.lumara-step.active .lumara-step-circle{
  transform:scale(1.03);
}

.lumara-step strong{
  display:block;
  font-size:20px;
  line-height:1.05;
}

.lumara-step small{
  display:block;
  margin-top:3px;
  color:#4a4a4a;
  font-size:17px;
}

.lumara-step em{
  display:inline-block;
  margin-top:4px;
  padding:3px 9px;
  border-radius:999px;
  background:#d3e7c5;
  color:#5d7640;
  font-size:13px;
  font-style:normal;
  font-weight:800;
}

.lumara-step-tag{
  position:absolute;
  top:-16px;
  left:50%;
  transform:translateX(-50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:76px;
  padding:4px 9px;
  border-radius:999px;
  background:var(--lumara-neon);
  color:#111;
  font-size:12px;
  line-height:.9;
  font-weight:900;
  z-index:3;
}

.lumara-selected-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
  gap:22px;
  margin:18px 0 16px;
  padding:22px;
  border-radius:20px;
  background:#dfe9d6;
}

.lumara-selected-info{
  display:flex;
  align-items:center;
  gap:18px;
  min-width:0;
}

.lumara-selected-info img{
  width:72px;
  height:72px;
  min-width:72px;
  border-radius:15px;
  object-fit:cover;
  box-shadow:0 10px 22px rgba(0,0,0,.12);
}

.lumara-selected-info strong{
  display:block;
  font-size:31px;
  line-height:1.05;
  color:#111;
  overflow-wrap:anywhere;
}

.lumara-selected-info span{
  display:inline-block;
  margin-top:8px;
  padding:6px 10px;
  border-radius:9px;
  background:#fbfbf5;
  font-size:22px;
  color:#111;
}

.lumara-saving{
  display:block!important;
  margin-top:8px;
  color:#638044;
  font-size:17px;
  font-weight:900;
}

.lumara-saving[style*="display:none"]{
  display:none!important;
}

.lumara-selected-price{
  text-align:right;
  min-width:142px;
}

.lumara-selected-price .old-price{
  margin-bottom:2px;
  color:#8a8a8a;
  font-size:17px;
}

.lumara-selected-price strong{
  display:block;
  font-size:32px;
  font-weight:500;
  color:#111;
  white-space:nowrap;
}

.lumara-qty-controls{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  min-width:142px;
  padding:10px 16px;
  border-radius:999px;
  background:#f7f7f7;
}

.lumara-qty-controls button{
  width:28px;
  height:28px;
  border:0;
  background:transparent;
  color:#526333;
  font-size:30px;
  line-height:1;
  font-weight:900;
  cursor:pointer;
}

.lumara-qty-controls span{
  min-width:22px;
  text-align:center;
  color:#111;
  font-size:23px;
  font-weight:900;
}

.lumara-portion-card{
  position:relative;
  display:flex;
  align-items:center;
  gap:6px;
  min-height:72px;
  margin:14px 0 20px;
  padding:16px 82px 16px 20px;
  border:1px solid var(--lumara-border);
  border-radius:18px;
  background:#fff;
  color:#687060;
  font-size:21px;
  box-shadow:0 8px 28px rgba(90,111,58,.04);
}

.lumara-portion-card > strong{
  color:#111;
  font-size:27px;
}

.lumara-mini-products{
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  align-items:center;
}

.lumara-mini-products img{
  width:34px;
  height:34px;
  margin-left:-10px;
  border:2px solid #fff;
  border-radius:50%;
  object-fit:cover;
  box-shadow:0 6px 14px rgba(0,0,0,.12);
}

/* Oculta el select visual de cantidad, pero lo mantiene para compatibilidad JS/payload */
label[for="cantidad"],
#cantidad{
  display:none;
}

.form-grid label:nth-of-type(9),
.form-grid label:nth-last-of-type(1){
  display:none;
}

#cantidad{
  visibility:hidden;
  height:0;
  min-height:0;
  padding:0!important;
  border:0!important;
}

/* Ajuste de totales para convivir con el diseño nuevo */
.checkout-totals{
  margin-top:0!important;
}

@media(max-width:820px){
  .lumara-invima-card{
    padding:18px;
    gap:14px;
    border-radius:20px;
    margin-bottom:28px;
  }

  .lumara-invima-icon{
    width:52px;
    height:52px;
    min-width:52px;
    font-size:30px;
  }

  .lumara-invima-card strong{
    font-size:21px;
  }

  .lumara-invima-card p{
    font-size:15px;
  }

  .lumara-step-circle{
    width:58px;
    height:58px;
    font-size:28px;
  }

  .lumara-step strong{
    font-size:18px;
  }

  .lumara-step small{
    font-size:15px;
  }

  .lumara-selected-card{
    grid-template-columns:1fr;
    gap:12px;
    padding:18px;
  }

  .lumara-selected-info strong{
    font-size:26px;
  }

  .lumara-selected-info span{
    font-size:18px;
  }

  .lumara-selected-price{
    text-align:left;
  }

  .lumara-selected-price strong{
    font-size:30px;
  }

  .lumara-qty-controls{
    position:absolute;
    right:18px;
    bottom:18px;
    min-width:122px;
    gap:12px;
  }

  .lumara-selected-card{
    position:relative;
    padding-bottom:86px;
  }

  .lumara-portion-card{
    font-size:17px;
    padding-right:74px;
  }

  .lumara-portion-card > strong{
    font-size:23px;
  }

  .lumara-buy-now{
    font-size:19px;
    padding:20px 18px;
  }
}

@media(max-width:520px){
  .lumara-pack-steps{
    gap:2px;
  }

  .lumara-progress-track{
    left:9%;
    right:9%;
  }

  .lumara-step-circle{
    width:52px;
    height:52px;
    border-width:4px;
    font-size:24px;
  }

  .lumara-step strong{
    font-size:16px;
  }

  .lumara-step small{
    font-size:14px;
  }

  .lumara-step em{
    font-size:11px;
    padding:3px 7px;
  }

  .lumara-step-tag{
    min-width:66px;
    font-size:10px;
    top:-13px;
  }

  .lumara-selected-info{
    gap:12px;
  }

  .lumara-selected-info img{
    width:58px;
    height:58px;
    min-width:58px;
    border-radius:13px;
  }

  .lumara-selected-info strong{
    font-size:23px;
  }

  .lumara-selected-info span{
    font-size:16px;
  }

  .lumara-selected-price strong{
    font-size:27px;
  }

  .lumara-qty-controls{
    min-width:112px;
    padding:9px 12px;
  }
}


/* ============================================================
   LUMARA - TIPOGRAFÍA PREMIUM
   Inspirada en la referencia visual enviada: texto más limpio,
   números más elegantes y pesos mejor balanceados.
   ============================================================ */
:root{
  --lumara-font-main:"Poppins", Arial, Helvetica, sans-serif;
  --lumara-font-logo:"Cormorant Garamond", Georgia, serif;
}

html, body,
button, input, select, textarea{
  font-family:var(--lumara-font-main)!important;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:geometricPrecision;
}

body{
  color:#171717;
  font-weight:400;
  letter-spacing:-.012em;
}

/* Logo / marca superior con aire premium */
.brand{
  font-family:var(--lumara-font-logo)!important;
  font-size:34px!important;
  line-height:.9!important;
  font-weight:700!important;
  letter-spacing:-.035em!important;
  text-transform:none!important;
  color:#465035!important;
}

/* Títulos principales */
h1,
.checkout-dialog h2,
#heroTitle,
#checkoutTitle{
  font-family:var(--lumara-font-main)!important;
  font-weight:800!important;
  letter-spacing:-.045em!important;
  color:#151515!important;
}

.hero-content p,
.rating span,
.lumara-invima-card p,
.lumara-portion-card span,
.trust,
.pay-note{
  font-weight:400!important;
  letter-spacing:-.015em!important;
}

/* Números: más parecidos a la referencia, limpios y compactos */
.price,
#productPrice,
#stickyPrice,
#modalSubtotal,
#modalDiscount,
#modalTotal,
#selectedTotal,
#portionPrice,
#portionTotalMuted,
#stepPrice1,
#stepCompare2,
#stepCompare3,
.lumara-selected-price strong,
.lumara-portion-card > strong,
.checkout-totals strong,
.option-price,
.old-price,
.lumara-step small,
.lumara-step em{
  font-family:var(--lumara-font-main)!important;
  font-variant-numeric:tabular-nums lining-nums;
  letter-spacing:-.045em!important;
}

/* Precio principal del producto seleccionado: menos pesado, más premium */
.lumara-selected-price strong,
#selectedTotal{
  font-size:38px!important;
  font-weight:500!important;
  line-height:1!important;
}

.lumara-selected-price .old-price,
#selectedCompare{
  font-size:19px!important;
  font-weight:500!important;
  color:#8e908a!important;
  letter-spacing:-.035em!important;
}

/* Nombre del producto dentro de la tarjeta */
.lumara-selected-info strong,
#modalProductTitle{
  font-weight:800!important;
  letter-spacing:-.045em!important;
  line-height:1.05!important;
}

.lumara-selected-info span{
  font-weight:400!important;
  letter-spacing:-.025em!important;
}

.lumara-saving{
  font-weight:700!important;
  letter-spacing:-.025em!important;
}

/* Steps 1, 2, 3 */
.lumara-step strong{
  font-weight:700!important;
  letter-spacing:-.03em!important;
}

.lumara-step small{
  font-weight:400!important;
  color:#505050!important;
}

.lumara-step em{
  font-weight:700!important;
}

.lumara-step-tag{
  font-weight:800!important;
  letter-spacing:-.035em!important;
  line-height:.9!important;
}

.lumara-step-circle{
  font-weight:700!important;
}

/* INVIMA */
.lumara-invima-card span{
  font-weight:700!important;
  letter-spacing:-.025em!important;
}

.lumara-invima-card strong{
  font-weight:800!important;
  letter-spacing:-.04em!important;
}

/* Porción */
.lumara-portion-card{
  font-weight:400!important;
  letter-spacing:-.02em!important;
}

.lumara-portion-card > strong{
  font-weight:800!important;
  letter-spacing:-.045em!important;
}

/* Totales checkout: jerarquía más limpia */
.checkout-totals div{
  font-weight:400!important;
  letter-spacing:-.018em!important;
}

.checkout-totals strong{
  font-weight:700!important;
}

.checkout-totals .total-line span,
.checkout-totals .total-line strong{
  font-weight:800!important;
  letter-spacing:-.045em!important;
}

.checkout-totals .total-line strong{
  font-size:30px!important;
}

/* Botones */
.pay-btn,
.primary-btn,
.sticky-buy button{
  font-family:var(--lumara-font-main)!important;
  font-weight:800!important;
  letter-spacing:.01em!important;
}

/* Formulario más limpio */
.popup-form label{
  font-weight:700!important;
  letter-spacing:-.025em!important;
}

.input-icon input,
.form-grid select{
  font-weight:400!important;
  letter-spacing:-.02em!important;
}

.address-warning{
  font-weight:800!important;
  letter-spacing:-.025em!important;
}

@media(max-width:820px){
  .brand{
    font-size:30px!important;
  }

  .checkout-dialog h2,
  #checkoutTitle{
    font-size:34px!important;
    letter-spacing:-.05em!important;
  }

  .lumara-selected-price strong,
  #selectedTotal{
    font-size:34px!important;
  }

  .checkout-totals .total-line strong{
    font-size:28px!important;
  }
}

@media(max-width:520px){
  .checkout-dialog h2,
  #checkoutTitle{
    font-size:30px!important;
  }

  .lumara-selected-info strong,
  #modalProductTitle{
    font-size:24px!important;
  }

  .lumara-selected-price strong,
  #selectedTotal{
    font-size:31px!important;
  }

  .lumara-portion-card > strong{
    font-size:24px!important;
  }

  .checkout-totals .total-line strong{
    font-size:26px!important;
  }
}


/* ============================================================
   LUMARA AJUSTE FINAL - Sin INVIMA + más premium
   ============================================================ */
.checkout-dialog{
  background:
    radial-gradient(circle at 18% 0%, rgba(187,237,57,.08), transparent 28%),
    linear-gradient(180deg,#ffffff 0%,#fff 48%,#fbfcf8 100%)!important;
  border:1px solid rgba(82,99,51,.10)!important;
  box-shadow:0 34px 100px rgba(0,0,0,.30), 0 0 0 1px rgba(255,255,255,.7) inset!important;
}

.checkout-dialog h2,
#checkoutTitle{
  margin-bottom:30px!important;
  font-size:38px!important;
  font-weight:850!important;
}

/* Al quitar INVIMA, el selector respira mejor */
.lumara-pack-steps{
  margin:18px 0 30px!important;
  padding-top:28px!important;
}

.lumara-progress-track{
  height:4px!important;
  border-radius:999px!important;
  background:#e7eadf!important;
}

.lumara-progress-track span{
  border-radius:999px!important;
  background:linear-gradient(90deg,#d8e6ce,#7a8b45)!important;
}

.lumara-step-circle{
  background:#d9e8cd!important;
  border:6px solid #fff!important;
  box-shadow:0 14px 30px rgba(82,99,51,.12)!important;
}

.lumara-step.active .lumara-step-circle,
.lumara-step.completed .lumara-step-circle{
  background:linear-gradient(180deg,#d7e9c9,#bfd9ae)!important;
}

.lumara-step-tag,
.lumara-step em{
  box-shadow:0 8px 18px rgba(93,118,64,.12)!important;
}

.lumara-selected-card{
  background:linear-gradient(135deg,#e6efdd 0%,#dce8d2 100%)!important;
  border:1px solid rgba(82,99,51,.10)!important;
  box-shadow:0 16px 38px rgba(82,99,51,.10)!important;
  padding:24px!important;
}

.lumara-selected-info img{
  width:76px!important;
  height:76px!important;
  border-radius:18px!important;
  box-shadow:0 14px 26px rgba(0,0,0,.14)!important;
}

.lumara-selected-info strong,
#modalProductTitle{
  font-size:30px!important;
  font-weight:850!important;
}

.lumara-selected-info span{
  background:rgba(255,255,250,.88)!important;
  box-shadow:0 6px 16px rgba(82,99,51,.07)!important;
}

/* Ahorro: nunca aparece en 1 unidad; solo cuando JS activa is-visible */
.lumara-saving{
  display:none!important;
  margin-top:9px!important;
  color:#5f7b3f!important;
}

.lumara-saving.is-visible{
  display:block!important;
}

.lumara-selected-price strong,
#selectedTotal{
  font-size:36px!important;
  font-weight:500!important;
}

.lumara-qty-controls{
  background:#fbfbf8!important;
  box-shadow:0 10px 24px rgba(82,99,51,.08)!important;
}

.lumara-qty-controls button{
  color:#526333!important;
  transition:transform .15s ease, opacity .15s ease!important;
}

.lumara-qty-controls button:hover{
  transform:scale(1.08)!important;
  opacity:.9!important;
}

.lumara-portion-card{
  border:1px solid rgba(122,139,69,.20)!important;
  background:rgba(255,255,255,.92)!important;
  box-shadow:0 14px 32px rgba(82,99,51,.08)!important;
}

.checkout-totals{
  background:linear-gradient(180deg,#f8fafc,#f3f6f8)!important;
  border:1px solid rgba(15,23,42,.04)!important;
  box-shadow:0 10px 28px rgba(15,23,42,.04)!important;
}

@media(max-width:820px){
  .checkout-dialog h2,
  #checkoutTitle{
    font-size:31px!important;
    margin-bottom:24px!important;
  }
  .lumara-pack-steps{
    margin-top:8px!important;
  }
  .lumara-selected-card{
    padding:18px!important;
  }
}

@media(max-width:520px){
  .checkout-dialog{
    padding:24px 14px!important;
  }
  .checkout-dialog h2,
  #checkoutTitle{
    font-size:28px!important;
    padding-right:42px!important;
  }
  .lumara-selected-info strong,
  #modalProductTitle{
    font-size:22px!important;
  }
  .lumara-selected-price strong,
  #selectedTotal{
    font-size:29px!important;
  }
  .lumara-portion-card{
    min-height:64px!important;
  }
}


/* ============================================================
   LUMARA MOBILE PRO - Adaptación fina para celular
   Mejora lectura, orden y proporción sin cambiar colores
   ============================================================ */
@media(max-width:720px){
  .checkout-modal{
    padding:10px 8px 72px!important;
    background:rgba(0,0,0,.56)!important;
  }

  .checkout-dialog{
    width:min(100%, 640px)!important;
    margin:0 auto 28px!important;
    padding:22px 14px 26px!important;
    border-radius:30px!important;
    overflow:visible!important;
  }

  .modal-close{
    width:46px!important;
    height:46px!important;
    top:14px!important;
    right:14px!important;
    font-size:34px!important;
    line-height:1!important;
  }

  .checkout-dialog h2,
  #checkoutTitle{
    font-size:30px!important;
    line-height:1.05!important;
    padding:0 48px!important;
    margin:4px 0 30px!important;
    text-align:center!important;
    letter-spacing:-.055em!important;
  }

  .lumara-pack-steps{
    margin:6px 0 24px!important;
    padding:18px 2px 0!important;
    min-height:160px!important;
  }

  .lumara-progress-track{
    top:48px!important;
    left:10%!important;
    right:10%!important;
  }

  .lumara-step-circle{
    width:58px!important;
    height:58px!important;
    font-size:30px!important;
    border-width:5px!important;
  }

  .lumara-step-tag{
    top:-12px!important;
    font-size:10px!important;
    line-height:.92!important;
    padding:5px 10px!important;
  }

  .lumara-step strong{
    font-size:18px!important;
    line-height:1!important;
    margin-top:6px!important;
  }

  .lumara-step small{
    font-size:14px!important;
    margin-top:5px!important;
  }

  .lumara-step em{
    font-size:12px!important;
    padding:4px 9px!important;
    margin-top:6px!important;
  }

  .lumara-selected-card{
    display:grid!important;
    grid-template-columns:76px 1fr!important;
    grid-template-areas:
      "photo info"
      "price price"
      "qty qty"!important;
    gap:10px 12px!important;
    padding:18px!important;
    border-radius:24px!important;
    align-items:center!important;
  }

  .lumara-selected-info{
    grid-area:photo / photo / info / info!important;
    display:contents!important;
  }

  .lumara-selected-info img{
    grid-area:photo!important;
    width:76px!important;
    height:76px!important;
    border-radius:18px!important;
    align-self:center!important;
  }

  .lumara-selected-info > div{
    grid-area:info!important;
    min-width:0!important;
    align-self:center!important;
  }

  .lumara-selected-info strong,
  #modalProductTitle{
    font-size:24px!important;
    line-height:1.05!important;
    letter-spacing:-.045em!important;
    overflow-wrap:anywhere!important;
  }

  .lumara-selected-info span{
    font-size:17px!important;
    padding:7px 11px!important;
    border-radius:9px!important;
    margin-top:6px!important;
  }

  .lumara-saving{
    font-size:16px!important;
    line-height:1.05!important;
    margin-top:9px!important;
    font-weight:800!important;
  }

  .lumara-selected-price{
    grid-area:price!important;
    width:100%!important;
    text-align:left!important;
    align-items:flex-start!important;
    justify-self:stretch!important;
    padding:4px 0 0!important;
  }

  .lumara-selected-price .old-price,
  #selectedCompare{
    font-size:18px!important;
    margin-bottom:2px!important;
  }

  .lumara-selected-price strong,
  #selectedTotal{
    font-size:36px!important;
    line-height:.98!important;
    letter-spacing:-.045em!important;
    font-weight:500!important;
  }

  .lumara-qty-controls{
    grid-area:qty!important;
    justify-self:end!important;
    width:190px!important;
    height:58px!important;
    border-radius:999px!important;
    margin-top:-62px!important;
  }

  .lumara-qty-controls button{
    width:54px!important;
    font-size:34px!important;
  }

  .lumara-qty-controls span{
    min-width:42px!important;
    font-size:29px!important;
    line-height:1!important;
  }

  .lumara-portion-card{
    min-height:62px!important;
    padding:13px 14px!important;
    border-radius:18px!important;
    display:flex!important;
    align-items:center!important;
    gap:5px!important;
    flex-wrap:nowrap!important;
  }

  .lumara-portion-card > span:first-child{
    font-size:17px!important;
    white-space:nowrap!important;
  }

  .lumara-portion-card > strong,
  #portionPrice{
    font-size:26px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  .lumara-portion-card > span:not(:first-child){
    font-size:17px!important;
    white-space:nowrap!important;
  }

  .lumara-mini-products{
    margin-left:auto!important;
    min-width:max-content!important;
  }

  .lumara-mini-products img{
    width:34px!important;
    height:34px!important;
    margin-left:-11px!important;
  }

  .checkout-totals{
    border-radius:22px!important;
    padding:18px!important;
    margin-top:18px!important;
  }

  .checkout-totals div{
    font-size:16px!important;
    padding:8px 0!important;
  }

  .checkout-totals .total-line{
    margin-top:8px!important;
    padding-top:12px!important;
    border-top:1px solid rgba(15,23,42,.08)!important;
  }

  .checkout-totals .total-line span{
    font-size:24px!important;
  }

  .checkout-totals .total-line strong{
    font-size:28px!important;
  }
}

@media(max-width:430px){
  .checkout-modal{
    padding:8px 6px 64px!important;
  }

  .checkout-dialog{
    padding:20px 10px 24px!important;
    border-radius:26px!important;
  }

  .checkout-dialog h2,
  #checkoutTitle{
    font-size:27px!important;
    padding:0 44px!important;
    margin-bottom:24px!important;
  }

  .lumara-pack-steps{
    min-height:150px!important;
  }

  .lumara-step-circle{
    width:52px!important;
    height:52px!important;
    font-size:27px!important;
  }

  .lumara-step strong{
    font-size:16px!important;
  }

  .lumara-step small{
    font-size:13px!important;
  }

  .lumara-step em{
    font-size:11px!important;
  }

  .lumara-selected-card{
    grid-template-columns:68px 1fr!important;
    gap:9px 10px!important;
    padding:15px!important;
    border-radius:22px!important;
  }

  .lumara-selected-info img{
    width:68px!important;
    height:68px!important;
    border-radius:16px!important;
  }

  .lumara-selected-info strong,
  #modalProductTitle{
    font-size:21px!important;
  }

  .lumara-selected-info span{
    font-size:15px!important;
    padding:6px 9px!important;
  }

  .lumara-saving{
    font-size:15px!important;
  }

  .lumara-selected-price strong,
  #selectedTotal{
    font-size:31px!important;
  }

  .lumara-selected-price .old-price,
  #selectedCompare{
    font-size:16px!important;
  }

  .lumara-qty-controls{
    width:156px!important;
    height:52px!important;
    margin-top:-56px!important;
  }

  .lumara-qty-controls button{
    width:45px!important;
    font-size:29px!important;
  }

  .lumara-qty-controls span{
    font-size:25px!important;
  }

  .lumara-portion-card{
    padding:12px 12px!important;
  }

  .lumara-portion-card > span:first-child{
    font-size:15px!important;
  }

  .lumara-portion-card > strong,
  #portionPrice{
    font-size:23px!important;
  }

  .lumara-portion-card > span:not(:first-child){
    font-size:15px!important;
  }

  .lumara-mini-products img{
    width:30px!important;
    height:30px!important;
  }
}

@media(max-width:365px){
  .lumara-selected-card{
    grid-template-columns:60px 1fr!important;
    padding:13px!important;
  }

  .lumara-selected-info img{
    width:60px!important;
    height:60px!important;
  }

  .lumara-selected-info strong,
  #modalProductTitle{
    font-size:19px!important;
  }

  .lumara-selected-price strong,
  #selectedTotal{
    font-size:28px!important;
  }

  .lumara-qty-controls{
    width:138px!important;
    height:48px!important;
    margin-top:-52px!important;
  }

  .lumara-portion-card{
    gap:4px!important;
  }

  .lumara-portion-card > strong,
  #portionPrice{
    font-size:21px!important;
  }
}

/* ============================================================
   LUMARA MOBILE FINISHING - Pulido fino para celular
   Ajusta aire, pesos visuales y distribución sin cambiar lógica.
   ============================================================ */
@media(max-width:640px){
  .checkout-modal{
    padding:8px 6px 74px!important;
    background:rgba(0,0,0,.62)!important;
  }

  .checkout-dialog{
    width:calc(100vw - 16px)!important;
    margin:6px auto 34px!important;
    padding:22px 18px 28px!important;
    border-radius:30px!important;
    background:linear-gradient(180deg,#fffef9 0%,#fbfff5 42%,#ffffff 100%)!important;
  }

  .checkout-dialog h2,
  #checkoutTitle{
    font-size:clamp(30px,8.3vw,38px)!important;
    line-height:1.02!important;
    letter-spacing:-1.5px!important;
    margin:4px 52px 28px 0!important;
    text-align:center!important;
  }

  .modal-close{
    top:14px!important;
    right:14px!important;
    width:48px!important;
    height:48px!important;
    font-size:36px!important;
    box-shadow:0 8px 20px rgba(0,0,0,.08)!important;
  }

  .lumara-pack-steps{
    margin:26px 0 24px!important;
    padding:0 8px!important;
  }

  .lumara-progress-track{
    top:38px!important;
    left:42px!important;
    right:42px!important;
    height:5px!important;
    opacity:.75!important;
  }

  .lumara-step{
    min-width:88px!important;
  }

  .lumara-step-circle{
    width:62px!important;
    height:62px!important;
    font-size:35px!important;
    border-width:7px!important;
    box-shadow:0 12px 22px rgba(62,85,45,.11)!important;
  }

  .lumara-step strong{
    font-size:24px!important;
    line-height:1!important;
    margin-top:8px!important;
    letter-spacing:-.4px!important;
  }

  .lumara-step small{
    font-size:17px!important;
    line-height:1.15!important;
    margin-top:5px!important;
  }

  .lumara-step em{
    font-size:13px!important;
    padding:4px 9px!important;
    margin-top:7px!important;
  }

  .lumara-step-tag{
    font-size:12px!important;
    line-height:.9!important;
    padding:6px 12px!important;
    top:-12px!important;
    border-radius:999px!important;
  }

  .lumara-selected-card{
    display:grid!important;
    grid-template-columns:86px minmax(0,1fr)!important;
    grid-template-areas:
      "img title"
      "price qty"!important;
    align-items:center!important;
    gap:12px 15px!important;
    padding:18px 18px!important;
    border-radius:24px!important;
    box-shadow:0 16px 34px rgba(89,110,67,.12)!important;
  }

  .lumara-selected-info{
    display:contents!important;
  }

  .lumara-selected-info img{
    grid-area:img!important;
    width:86px!important;
    height:86px!important;
    border-radius:19px!important;
  }

  .lumara-selected-info > div{
    grid-area:title!important;
    min-width:0!important;
    align-self:center!important;
  }

  .lumara-selected-info strong,
  #modalProductTitle{
    display:block!important;
    font-size:25px!important;
    line-height:1.02!important;
    letter-spacing:-.9px!important;
    font-weight:850!important;
    max-width:100%!important;
  }

  .lumara-selected-info span{
    display:inline-block!important;
    font-size:19px!important;
    line-height:1!important;
    padding:8px 11px!important;
    margin-top:8px!important;
    border-radius:10px!important;
  }

  .lumara-saving{
    font-size:16px!important;
    margin-top:9px!important;
    color:#637f41!important;
  }

  .lumara-selected-price{
    grid-area:price!important;
    align-self:end!important;
    text-align:left!important;
    min-width:0!important;
    padding:0!important;
  }

  .lumara-selected-price strong,
  #selectedTotal{
    font-size:34px!important;
    line-height:1!important;
    letter-spacing:-1.2px!important;
    font-weight:500!important;
    white-space:nowrap!important;
  }

  .lumara-selected-price .old-price,
  #selectedCompare{
    font-size:17px!important;
    margin-bottom:5px!important;
  }

  .lumara-qty-controls{
    grid-area:qty!important;
    align-self:end!important;
    justify-self:end!important;
    width:154px!important;
    height:52px!important;
    margin:0!important;
    border-radius:999px!important;
    box-shadow:0 10px 24px rgba(0,0,0,.06)!important;
  }

  .lumara-qty-controls button{
    width:46px!important;
    font-size:29px!important;
  }

  .lumara-qty-controls span{
    font-size:28px!important;
    font-weight:800!important;
  }

  .lumara-portion-card{
    min-height:62px!important;
    padding:12px 16px!important;
    border-radius:18px!important;
    display:flex!important;
    align-items:center!important;
    gap:5px!important;
    box-shadow:0 12px 28px rgba(0,0,0,.045)!important;
  }

  .lumara-portion-card > span:first-child{
    font-size:18px!important;
    white-space:nowrap!important;
  }

  .lumara-portion-card > strong,
  #portionPrice{
    font-size:27px!important;
    letter-spacing:-.7px!important;
    white-space:nowrap!important;
  }

  .lumara-portion-card > span:not(:first-child){
    font-size:18px!important;
    white-space:nowrap!important;
  }

  .lumara-mini-products{
    margin-left:auto!important;
    flex-shrink:0!important;
  }

  .lumara-mini-products img{
    width:33px!important;
    height:33px!important;
  }

  .checkout-totals{
    padding:24px 24px!important;
    border-radius:24px!important;
    box-shadow:0 16px 38px rgba(21,31,43,.06)!important;
  }

  .checkout-totals div{
    font-size:20px!important;
    line-height:1.2!important;
    gap:12px!important;
  }

  .checkout-totals strong{
    font-size:19px!important;
    white-space:nowrap!important;
  }

  .checkout-totals .total-line{
    margin-top:8px!important;
    padding-top:18px!important;
    border-top:1px solid rgba(20,27,35,.08)!important;
  }

  .checkout-totals .total-line span{
    font-size:31px!important;
  }

  .checkout-totals .total-line strong{
    font-size:34px!important;
    letter-spacing:-1px!important;
  }
}

@media(max-width:390px){
  .checkout-dialog{
    padding:20px 14px 26px!important;
    border-radius:26px!important;
  }

  .checkout-dialog h2,
  #checkoutTitle{
    font-size:29px!important;
    margin-right:48px!important;
  }

  .lumara-step-circle{
    width:56px!important;
    height:56px!important;
    font-size:31px!important;
  }

  .lumara-step strong{
    font-size:21px!important;
  }

  .lumara-step small{
    font-size:15px!important;
  }

  .lumara-step-tag{
    font-size:10.5px!important;
  }

  .lumara-selected-card{
    grid-template-columns:74px minmax(0,1fr)!important;
    gap:10px 12px!important;
    padding:15px!important;
  }

  .lumara-selected-info img{
    width:74px!important;
    height:74px!important;
  }

  .lumara-selected-info strong,
  #modalProductTitle{
    font-size:22px!important;
  }

  .lumara-selected-info span{
    font-size:16px!important;
    padding:7px 10px!important;
  }

  .lumara-selected-price strong,
  #selectedTotal{
    font-size:30px!important;
  }

  .lumara-qty-controls{
    width:132px!important;
    height:48px!important;
  }

  .lumara-qty-controls button{
    width:39px!important;
    font-size:25px!important;
  }

  .lumara-qty-controls span{
    font-size:24px!important;
  }

  .lumara-portion-card > span:first-child,
  .lumara-portion-card > span:not(:first-child){
    font-size:15px!important;
  }

  .lumara-portion-card > strong,
  #portionPrice{
    font-size:23px!important;
  }

  .checkout-totals{
    padding:21px 18px!important;
  }

  .checkout-totals div{
    font-size:18px!important;
  }

  .checkout-totals .total-line span{
    font-size:27px!important;
  }

  .checkout-totals .total-line strong{
    font-size:30px!important;
  }
}

/* ============================================================
   LUMARA MOBILE COMPACT FINAL - Menos grande y sin montajes
   ============================================================ */
@media (max-width: 720px){
  .checkout-modal{
    padding:8px 6px 56px!important;
  }

  .checkout-dialog{
    width:calc(100vw - 12px)!important;
    margin:0 auto 18px!important;
    padding:18px 12px 22px!important;
    border-radius:24px!important;
  }

  .modal-close{
    width:42px!important;
    height:42px!important;
    top:12px!important;
    right:12px!important;
    font-size:30px!important;
  }

  .checkout-dialog h2,
  #checkoutTitle{
    font-size:28px!important;
    line-height:1.02!important;
    padding:0 44px!important;
    margin:2px 0 20px!important;
    letter-spacing:-.05em!important;
  }

  .lumara-pack-steps{
    margin:0 0 16px!important;
    padding:12px 0 0!important;
    min-height:116px!important;
    gap:4px!important;
  }

  .lumara-progress-track{
    top:37px!important;
    left:14%!important;
    right:14%!important;
    height:3px!important;
  }

  .lumara-step{
    padding:0 1px!important;
  }

  .lumara-step-circle{
    width:44px!important;
    height:44px!important;
    font-size:23px!important;
    border-width:4px!important;
    margin-bottom:6px!important;
    box-shadow:0 8px 18px rgba(0,0,0,.07)!important;
  }

  .lumara-step-tag{
    top:-10px!important;
    min-width:62px!important;
    padding:4px 7px!important;
    font-size:9px!important;
    line-height:.9!important;
  }

  .lumara-step strong{
    font-size:15px!important;
    line-height:1!important;
    margin-top:4px!important;
  }

  .lumara-step small{
    font-size:12px!important;
    margin-top:4px!important;
  }

  .lumara-step em{
    font-size:10px!important;
    padding:3px 7px!important;
    margin-top:4px!important;
  }

  .lumara-selected-card{
    grid-template-columns:62px minmax(0, 1fr)!important;
    grid-template-areas:
      "photo info"
      "price qty"!important;
    gap:10px 12px!important;
    padding:14px!important;
    border-radius:20px!important;
    min-height:auto!important;
  }

  .lumara-selected-info{
    display:contents!important;
  }

  .lumara-selected-info img{
    grid-area:photo!important;
    width:62px!important;
    height:62px!important;
    border-radius:15px!important;
  }

  .lumara-selected-info > div{
    grid-area:info!important;
    min-width:0!important;
    align-self:center!important;
  }

  .lumara-selected-info strong,
  #modalProductTitle{
    font-size:20px!important;
    line-height:1.02!important;
    letter-spacing:-.04em!important;
  }

  .lumara-selected-info span{
    font-size:14px!important;
    padding:6px 9px!important;
    border-radius:8px!important;
    margin-top:5px!important;
  }

  .lumara-saving{
    font-size:13px!important;
    line-height:1.05!important;
    margin-top:6px!important;
  }

  .lumara-selected-price{
    grid-area:price!important;
    width:100%!important;
    text-align:left!important;
    padding:0!important;
    align-self:center!important;
  }

  .lumara-selected-price .old-price,
  #selectedCompare{
    font-size:14px!important;
    margin-bottom:2px!important;
  }

  .lumara-selected-price strong,
  #selectedTotal{
    font-size:30px!important;
    line-height:1!important;
    letter-spacing:-.045em!important;
  }

  .lumara-qty-controls{
    grid-area:qty!important;
    justify-self:end!important;
    align-self:center!important;
    width:142px!important;
    height:46px!important;
    margin:0!important;
    border-radius:999px!important;
  }

  .lumara-qty-controls button{
    width:42px!important;
    font-size:25px!important;
  }

  .lumara-qty-controls span{
    min-width:34px!important;
    font-size:23px!important;
  }

  .lumara-portion-card{
    min-height:54px!important;
    padding:10px 12px!important;
    border-radius:16px!important;
    display:grid!important;
    grid-template-columns:auto auto 1fr!important;
    align-items:center!important;
    column-gap:5px!important;
    overflow:hidden!important;
  }

  .lumara-portion-card > span:first-child{
    font-size:14px!important;
    white-space:nowrap!important;
  }

  .lumara-portion-card > strong,
  #portionPrice{
    font-size:23px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  .lumara-portion-card > span:not(:first-child){
    font-size:14px!important;
    white-space:nowrap!important;
  }

  .lumara-mini-products{
    justify-self:end!important;
    margin-left:4px!important;
    max-width:42px!important;
    overflow:hidden!important;
  }

  .lumara-mini-products img{
    width:28px!important;
    height:28px!important;
    margin-left:-10px!important;
  }

  .checkout-totals{
    padding:16px!important;
    border-radius:20px!important;
    margin-top:16px!important;
  }

  .checkout-totals div{
    font-size:15px!important;
    padding:7px 0!important;
    gap:12px!important;
  }

  .checkout-totals .discount-line span{
    font-size:14px!important;
    line-height:1.15!important;
  }

  .checkout-totals .total-line span{
    font-size:23px!important;
  }

  .checkout-totals .total-line strong{
    font-size:28px!important;
  }
}

@media (max-width: 430px){
  .checkout-dialog{
    padding:16px 10px 20px!important;
    border-radius:22px!important;
  }

  .checkout-dialog h2,
  #checkoutTitle{
    font-size:25px!important;
    margin-bottom:18px!important;
    padding:0 42px!important;
  }

  .lumara-pack-steps{
    min-height:108px!important;
  }

  .lumara-progress-track{
    top:34px!important;
  }

  .lumara-step-circle{
    width:40px!important;
    height:40px!important;
    font-size:21px!important;
    border-width:4px!important;
  }

  .lumara-step strong{
    font-size:14px!important;
  }

  .lumara-step small{
    font-size:11px!important;
  }

  .lumara-step em{
    font-size:9px!important;
    padding:3px 6px!important;
  }

  .lumara-step-tag{
    font-size:8.5px!important;
    min-width:58px!important;
  }

  .lumara-selected-card{
    grid-template-columns:56px minmax(0, 1fr)!important;
    padding:12px!important;
    gap:8px 10px!important;
  }

  .lumara-selected-info img{
    width:56px!important;
    height:56px!important;
    border-radius:13px!important;
  }

  .lumara-selected-info strong,
  #modalProductTitle{
    font-size:18px!important;
  }

  .lumara-selected-info span{
    font-size:13px!important;
    padding:5px 8px!important;
  }

  .lumara-saving{
    font-size:12px!important;
  }

  .lumara-selected-price strong,
  #selectedTotal{
    font-size:27px!important;
  }

  .lumara-qty-controls{
    width:126px!important;
    height:42px!important;
  }

  .lumara-qty-controls button{
    width:38px!important;
    font-size:23px!important;
  }

  .lumara-qty-controls span{
    font-size:21px!important;
  }

  .lumara-portion-card{
    grid-template-columns:auto auto auto!important;
    justify-content:start!important;
  }

  .lumara-mini-products{
    display:none!important;
  }

  .lumara-portion-card > span:first-child{
    font-size:13px!important;
  }

  .lumara-portion-card > strong,
  #portionPrice{
    font-size:21px!important;
  }

  .lumara-portion-card > span:not(:first-child){
    font-size:13px!important;
  }
}


/* ============================================================
   LUMARA FIX FINAL - formulario móvil + porción con mini productos
   Mantiene el diseño compacto y corrige solapamientos en móvil.
   ============================================================ */

/* Siempre muestra los productos pequeños en el bloque por porción */
.lumara-portion-card{
  position:relative!important;
  padding-right:72px!important;
  overflow:hidden!important;
}

.lumara-mini-products{
  display:flex!important;
  position:absolute!important;
  right:14px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  align-items:center!important;
  justify-content:flex-end!important;
  max-width:62px!important;
  overflow:visible!important;
  pointer-events:none!important;
}

.lumara-mini-products img{
  display:block!important;
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  border-radius:50%!important;
  object-fit:cover!important;
  border:2px solid #fff!important;
  margin-left:-11px!important;
  box-shadow:0 6px 16px rgba(0,0,0,.16)!important;
}

.lumara-mini-products img:first-child{
  margin-left:0!important;
}

/* Formulario más profesional en móvil: menos alto, más legible */
@media(max-width:640px){
  .popup-form{
    margin-top:18px!important;
  }

  .form-grid{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  .popup-form label{
    font-size:17px!important;
    line-height:1.15!important;
    margin:10px 0 0!important;
    font-weight:800!important;
    letter-spacing:-.025em!important;
  }

  .input-icon{
    min-height:56px!important;
    height:56px!important;
    border-radius:16px!important;
    border-color:#d2d2d2!important;
    background:#fff!important;
  }

  .input-icon span{
    width:58px!important;
    min-width:58px!important;
    font-size:20px!important;
    border-radius:16px 0 0 16px!important;
  }

  .input-icon input,
  .form-grid select{
    height:56px!important;
    min-height:56px!important;
    padding:0 16px!important;
    font-size:17px!important;
    line-height:1!important;
    border-radius:16px!important;
  }

  .input-icon input{
    border-left:1px solid #d2d2d2!important;
  }

  .address-warning{
    padding:16px 14px!important;
    margin:12px 0!important;
    font-size:18px!important;
    line-height:1.22!important;
    border-radius:18px!important;
  }

  .shipping-box{
    padding:18px!important;
    border-radius:22px!important;
  }

  .shipping-box h3{
    font-size:24px!important;
    margin-bottom:14px!important;
  }

  .shipping-option{
    min-height:58px!important;
    padding:12px 14px!important;
    font-size:18px!important;
    border-radius:18px!important;
  }

  .trust-logos{
    margin:18px 0!important;
    padding:14px 12px!important;
    font-size:14px!important;
    line-height:1.35!important;
    border-radius:18px!important;
  }

  .secure-shipping{
    margin:20px 0 10px!important;
  }

  .secure-shipping small{
    font-size:13px!important;
    margin-bottom:12px!important;
  }

  .secure-shipping strong{
    font-size:23px!important;
    letter-spacing:9px!important;
  }

  .pay-btn{
    font-size:20px!important;
    line-height:1.18!important;
    padding:18px 12px 10px!important;
    border-radius:14px 14px 0 0!important;
  }

  .pay-note{
    font-size:15px!important;
    line-height:1.35!important;
    padding:0 14px 18px!important;
    border-radius:0 0 14px 14px!important;
  }

  /* El selector de cantidad inferior sigue oculto; la cantidad se controla arriba */
  .form-grid label:last-of-type,
  #cantidad{
    display:none!important;
  }
}

@media(max-width:430px){
  .lumara-portion-card{
    display:grid!important;
    grid-template-columns:auto auto auto!important;
    column-gap:5px!important;
    align-items:center!important;
    min-height:52px!important;
    padding:10px 64px 10px 12px!important;
    border-radius:16px!important;
    overflow:hidden!important;
  }

  .lumara-portion-card > span:first-child{
    font-size:13px!important;
    white-space:nowrap!important;
  }

  .lumara-portion-card > strong,
  #portionPrice{
    font-size:20px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  .lumara-portion-card > span:not(:first-child){
    font-size:12.5px!important;
    white-space:nowrap!important;
  }

  .lumara-mini-products{
    display:flex!important;
    right:10px!important;
    max-width:50px!important;
  }

  .lumara-mini-products img{
    width:25px!important;
    height:25px!important;
    min-width:25px!important;
    margin-left:-10px!important;
  }

  .popup-form label{
    font-size:16px!important;
  }

  .input-icon,
  .input-icon input,
  .form-grid select{
    height:52px!important;
    min-height:52px!important;
  }

  .input-icon span{
    width:52px!important;
    min-width:52px!important;
    font-size:18px!important;
  }

  .input-icon input,
  .form-grid select{
    font-size:16px!important;
    padding:0 14px!important;
  }

  .address-warning{
    font-size:16px!important;
    padding:14px 12px!important;
  }

  .checkout-totals .discount-line span{
    font-size:13.5px!important;
  }
}

@media(max-width:380px){
  .lumara-portion-card{
    grid-template-columns:1fr auto!important;
    row-gap:2px!important;
    padding-right:56px!important;
  }

  .lumara-portion-card > span:first-child{
    grid-column:1 / 2!important;
  }

  .lumara-portion-card > strong,
  #portionPrice{
    grid-column:2 / 3!important;
    grid-row:1 / 2!important;
    font-size:19px!important;
  }

  .lumara-portion-card > span:not(:first-child){
    grid-column:1 / 3!important;
  }

  .lumara-mini-products img{
    width:23px!important;
    height:23px!important;
    min-width:23px!important;
  }
}


/* ============================================================
   LUMARA PREMIUM HERO + GALLERY
   ============================================================ */

:root{
  --lumara-bg:#f4f5ef;
  --lumara-surface:#ffffff;
  --lumara-olive:#67764a;
  --lumara-olive-dark:#56653d;
  --lumara-soft:#eef3e6;
  --lumara-soft-2:#f6faef;
  --lumara-lime:#b7ea36;
  --lumara-border:#dbe4d0;
  --lumara-text:#1a1d17;
  --lumara-muted:#5f6858;
}

body{
  font-family:'Poppins',Arial,Helvetica,sans-serif!important;
  background:var(--lumara-bg)!important;
  color:var(--lumara-text)!important;
}

.topbar{
  background:rgba(255,255,255,.94)!important;
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(103,118,74,.08);
  box-shadow:0 10px 34px rgba(48,58,35,.06)!important;
}

.brand{
  font-family:'Cormorant Garamond',serif!important;
  font-size:36px!important;
  font-weight:700!important;
  color:var(--lumara-olive-dark)!important;
  letter-spacing:0!important;
}

.trust{
  color:#5d6557!important;
  font-weight:500;
}

.hero.hero-premium{
  grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr)!important;
  gap:48px!important;
  padding:44px 6% 56px!important;
  background:linear-gradient(180deg,#f4f5ef 0%, #f2f4ed 100%)!important;
  align-items:start!important;
}

.hero-gallery{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.hero-main-frame{
  background:var(--lumara-surface);
  border-radius:34px;
  padding:16px;
  border:1px solid var(--lumara-border);
  box-shadow:0 22px 60px rgba(72,84,51,.10);
}

.hero-image{
  width:100%!important;
  display:block;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:28px;
  background:#f1f1ea;
}

.hero-thumbs{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}

.hero-thumb{
  appearance:none;
  border:1px solid var(--lumara-border);
  background:#fff;
  padding:8px;
  border-radius:22px;
  cursor:pointer;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
  box-shadow:0 8px 22px rgba(72,84,51,.06);
}
.hero-thumb:hover{transform:translateY(-2px)}
.hero-thumb.active{
  border-color:var(--lumara-olive);
  box-shadow:0 12px 28px rgba(103,118,74,.18);
}
.hero-thumb img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:16px;
  display:block;
}

.premium-content{align-items:flex-start;}

.badge{
  background:#111!important;
  color:#fff!important;
  padding:10px 16px!important;
  border-radius:999px!important;
  font-size:14px!important;
  font-weight:700!important;
  box-shadow:0 12px 28px rgba(0,0,0,.12);
}

#heroTitle{
  font-family:'Poppins',Arial,sans-serif!important;
  font-size:clamp(42px,5.5vw,72px)!important;
  font-weight:900!important;
  line-height:.96!important;
  letter-spacing:-.04em;
  color:#151712!important;
  margin:10px 0 12px!important;
}

.hero-subtitle{
  margin:0 0 10px!important;
  font-size:21px!important;
  font-weight:500!important;
  line-height:1.45!important;
  color:#61685d!important;
}

.premium-copy{
  max-width:700px;
  margin:0 0 22px!important;
  font-size:21px!important;
  line-height:1.6!important;
  color:#60685c!important;
}

.hero-invima-card{
  display:flex;
  align-items:center;
  gap:20px;
  width:100%;
  max-width:760px;
  margin:0 0 22px;
  padding:22px 28px;
  background:var(--lumara-soft-2);
  border:1px solid var(--lumara-border);
  border-radius:24px;
}
.hero-invima-icon{
  width:62px;
  height:62px;
  min-width:62px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--lumara-lime);
  font-size:34px;
  font-weight:900;
  color:#111;
}
.hero-invima-card span{
  display:block;
  font-size:14px;
  line-height:1.1;
  font-weight:800;
  color:var(--lumara-olive);
  margin-bottom:4px;
}
.hero-invima-card strong{
  display:block;
  font-size:23px;
  line-height:1.08;
  color:#111;
}
.hero-invima-card p{
  margin:4px 0 0!important;
  font-size:15px!important;
  color:#5d6657!important;
}

.rating{
  margin:4px 0 14px!important;
  color:#111;
  font-weight:800!important;
}
.rating span{color:#5a6154!important;}

.price-box{
  margin:10px 0 8px!important;
  gap:16px!important;
}
.price{
  font-size:54px!important;
  font-weight:900!important;
  letter-spacing:-.03em;
  color:#121410!important;
}
.compare-price{
  font-size:24px!important;
  color:#9da29a!important;
}
.stock{
  font-size:16px!important;
  color:#15713e!important;
  margin:0 0 8px!important;
}

.primary-btn{
  min-width:280px;
  background:#111!important;
  color:#fff!important;
  border-radius:18px!important;
  padding:18px 28px!important;
  font-size:20px!important;
  font-weight:800!important;
  box-shadow:0 18px 36px rgba(17,17,17,.14);
}

.mini-benefits{
  gap:12px!important;
  margin-top:6px;
}
.mini-benefits span{
  background:#fff!important;
  border:1px solid var(--lumara-border);
  border-radius:999px!important;
  padding:10px 14px!important;
  color:#495345;
  box-shadow:0 10px 26px rgba(72,84,51,.06)!important;
}

.benefits-section,.urgency,.faq{
  padding-left:6%!important;
  padding-right:6%!important;
}
.benefits-section h2,.faq h2,.urgency h2{
  font-size:40px;
  line-height:1.05;
  letter-spacing:-.03em;
  color:var(--lumara-olive-dark);
}
.benefit-card,details{
  border:1px solid var(--lumara-border);
  box-shadow:0 16px 34px rgba(72,84,51,.07)!important;
}

.sticky-buy{
  background:rgba(255,255,255,.95)!important;
  border-top:1px solid rgba(103,118,74,.12);
  backdrop-filter:blur(12px);
}
.sticky-buy button{
  background:#10a000!important;
  border-radius:14px!important;
}

@media (max-width: 1080px){
  .hero.hero-premium{
    grid-template-columns:1fr!important;
    gap:28px!important;
  }
  .premium-content{order:2;}
  .hero-gallery{order:1;}
}

@media (max-width: 820px){
  .topbar{
    padding:14px 5%!important;
    align-items:center!important;
    gap:6px!important;
  }
  .brand{font-size:32px!important;}
  .hero.hero-premium{
    padding:26px 5% 34px!important;
    gap:24px!important;
  }
  #heroTitle{font-size:54px!important;}
  .hero-subtitle,.premium-copy{font-size:18px!important;}
  .hero-invima-card{padding:18px 18px;border-radius:20px;}
  .price{font-size:44px!important;}
  .primary-btn{width:100%;min-width:0;}
}

@media (max-width: 560px){
  .trust{font-size:12px!important;}
  #heroTitle{font-size:46px!important;}
  .hero-main-frame{padding:12px;border-radius:24px;}
  .hero-image{border-radius:18px;}
  .hero-thumbs{gap:10px;}
  .hero-thumb{padding:6px;border-radius:18px;}
  .hero-thumb img{border-radius:12px;}
  .hero-subtitle,.premium-copy{font-size:17px!important;line-height:1.55!important;}
  .hero-invima-card{gap:14px;}
  .hero-invima-icon{width:54px;height:54px;min-width:54px;font-size:28px;}
  .hero-invima-card strong{font-size:20px;}
  .price{font-size:40px!important;}
  .mini-benefits span{font-size:13px;}
}


/* ============================================================
   PREMIUM EXTRA SECTIONS
   ============================================================ */

.premium-section{
  padding:24px 6% 34px;
}

.eyebrow{
  display:inline-block;
  margin-bottom:10px;
  color:var(--lumara-olive);
  font-size:14px;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
}

.section-heading.center{
  text-align:center;
  margin-bottom:28px;
}

.section-heading.center h2{
  margin:0;
  font-size:clamp(34px,4.6vw,72px);
  line-height:.97;
  letter-spacing:-.04em;
  color:var(--lumara-olive-dark);
}

.routine-section{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,560px);
  gap:52px;
  align-items:center;
  background:#f5f1e9;
  border-top:1px solid rgba(103,118,74,.08);
  border-bottom:1px solid rgba(103,118,74,.08);
}

.routine-copy h2{
  margin:0 0 18px;
  font-size:clamp(42px,5vw,78px);
  line-height:.95;
  letter-spacing:-.05em;
  color:var(--lumara-olive-dark);
  max-width:580px;
}

.routine-icons{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  max-width:760px;
  margin:8px 0 28px;
}

.routine-icon-card{
  text-align:center;
  color:#5d6657;
}
.routine-icon-card p{
  margin:10px 0 0;
  font-size:14px;
  line-height:1.35;
  font-weight:600;
}
.routine-icon{
  width:58px;
  height:58px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  border:1.5px solid rgba(103,118,74,.55);
  color:var(--lumara-olive);
  font-size:28px;
  font-weight:800;
}
.routine-endorsement{
  margin-bottom:24px;
  color:#5d6657;
}
.routine-endorsement strong{
  display:block;
  font-size:16px;
  color:#44503a;
}
.routine-endorsement p{
  margin:4px 0 0;
  font-size:14px;
}
.olive-btn{
  appearance:none;
  border:none;
  background:var(--lumara-olive);
  color:#fff;
  border-radius:999px;
  padding:18px 34px;
  font-size:20px;
  font-weight:800;
  box-shadow:0 14px 30px rgba(103,118,74,.18);
  cursor:pointer;
}
.olive-btn:hover{background:var(--lumara-olive-dark);}
.routine-media img{
  width:100%;
  display:block;
  border-radius:36px;
  box-shadow:0 24px 60px rgba(30,34,25,.16);
}

.compare-section{
  background:#f4f5ef;
}
.compare-table{
  display:grid;
  grid-template-columns:minmax(220px,1.9fr) minmax(160px,.65fr) minmax(160px,.65fr);
  border-radius:32px;
  overflow:hidden;
  box-shadow:0 26px 60px rgba(72,84,51,.10);
  border:1px solid var(--lumara-border);
}
.compare-head{
  padding:28px 22px;
  font-size:32px;
  font-weight:800;
  color:#fff;
}
.compare-head-feature,.compare-head-other{background:var(--lumara-olive);}
.compare-head-brand{
  background:#f8f8f6;
  color:var(--lumara-olive);
  text-align:center;
  border-left:1px solid var(--lumara-border);
  border-right:1px solid var(--lumara-border);
}
.compare-feature,.compare-cell{
  padding:24px 22px;
  font-size:22px;
  border-top:1px solid rgba(103,118,74,.12);
}
.compare-feature{
  background:#dce7cf;
  color:#55604c;
  font-weight:500;
}
.compare-cell{
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f8f8f6;
}
.compare-table > .compare-cell:nth-child(3n+2){
  border-left:1px solid rgba(103,118,74,.12);
  border-right:1px solid rgba(103,118,74,.12);
}
.compare-cell.yes::before,.compare-cell.no::before{
  width:54px;
  height:54px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  font-size:32px;
  font-weight:900;
}
.compare-cell.yes::before{
  content:'✓';
  background:var(--lumara-olive);
  color:#fff;
}
.compare-cell.yes.alt::before{background:#6c734a;}
.compare-cell.no::before{
  content:'×';
  background:#fff;
  color:#111;
}
.compare-cell.no.soft::before{background:#e2e2e0;}
.compare-cell{color:transparent;}

@media (max-width: 1080px){
  .routine-section{grid-template-columns:1fr;gap:28px;}
  .routine-media{order:2;}
  .routine-copy{order:1;}
}

@media (max-width: 820px){
  .premium-section{padding:22px 5% 28px;}
  .routine-copy h2{font-size:48px;}
  .routine-icons{gap:14px;}
  .compare-head{font-size:24px;padding:20px 12px;}
  .compare-feature,.compare-cell{font-size:16px;padding:18px 12px;}
  .compare-cell.yes::before,.compare-cell.no::before{width:42px;height:42px;font-size:24px;}
}

@media (max-width: 620px){
  .routine-section{background:#f7f2ea;border-radius:28px;margin:0 4% 8px;padding:24px 5%;}
  .routine-copy h2{font-size:40px;}
  .routine-icons{grid-template-columns:1fr;gap:16px;}
  .routine-icon-card{display:grid;grid-template-columns:58px 1fr;gap:14px;align-items:center;text-align:left;}
  .routine-icon-card p{margin:0;font-size:15px;}
  .routine-endorsement strong{font-size:15px;}
  .olive-btn{width:100%;font-size:18px;padding:16px 22px;}
  .routine-media img{border-radius:24px;}

  .section-heading.center h2{font-size:40px;}
  .compare-table{grid-template-columns:1.4fr .8fr .8fr;border-radius:24px;}
  .compare-head{font-size:18px;padding:16px 10px;}
  .compare-feature,.compare-cell{font-size:14px;padding:14px 10px;}
  .compare-cell.yes::before,.compare-cell.no::before{width:34px;height:34px;font-size:18px;}
}

/* ============================================================
   LUMARA PREMIUM - INFORMACIÓN NUTRICIONAL
   ============================================================ */

.nutrition-section{
  background:#f6f1e9;
  padding-top:54px!important;
  padding-bottom:64px!important;
}

.nutrition-heading{
  max-width:860px;
  margin:0 auto 34px;
  text-align:center;
}

.nutrition-heading h2{
  margin:0 0 16px;
  font-size:clamp(32px,4vw,52px);
  line-height:1;
  letter-spacing:-.04em;
  color:var(--lumara-olive-dark);
}

.nutrition-heading p{
  margin:0 auto;
  max-width:760px;
  color:#677067;
  font-size:17px;
  line-height:1.55;
  font-weight:500;
}

.nutrition-card{
  width:min(560px,100%);
  margin:0 auto;
  background:#fff;
  border-radius:12px;
  padding:10px;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 22px 54px rgba(72,84,51,.10);
}

.nutrition-title{
  background:#151515;
  color:#fff;
  text-align:center;
  font-size:30px;
  font-weight:900;
  letter-spacing:-.03em;
  padding:12px 10px;
}

.nutrition-meta{
  border-bottom:7px solid #151515;
  padding:10px 16px 12px;
  color:#1c1c1c;
}

.nutrition-meta p{
  margin:0;
  font-size:18px;
  line-height:1.15;
}

.nutrition-grid{
  display:grid;
  grid-template-columns:1.7fr .8fr .8fr;
  color:#111;
  font-size:16px;
  line-height:1.05;
}

.nutrition-grid > div{
  padding:4px 8px;
  border-bottom:1px solid #6f6f6f;
  border-right:1px solid #6f6f6f;
}

.nutrition-grid > div:nth-child(3n){
  border-right:0;
  text-align:right;
}

.nutrition-grid > div:nth-child(3n+2){
  text-align:right;
}

.nutrition-grid > div:nth-child(3n+1){
  text-align:left;
}

.nutrition-grid .main{
  font-size:28px;
  font-weight:900;
  display:flex;
  align-items:center;
  border-bottom:6px solid #151515;
}

.nutrition-grid .nutrient-col{
  text-align:center!important;
  font-size:17px;
  font-weight:800;
  border-bottom:6px solid #151515;
}

.nutrition-grid .nutrient-col strong{
  display:block;
  margin-top:4px;
  font-size:17px;
}

@media(max-width:640px){
  .nutrition-section{
    padding-top:38px!important;
    padding-bottom:44px!important;
  }

  .nutrition-heading h2{
    font-size:32px;
  }

  .nutrition-heading p{
    font-size:14px;
  }

  .nutrition-card{
    padding:7px;
    border-radius:10px;
  }

  .nutrition-title{
    font-size:21px;
    padding:10px 6px;
  }

  .nutrition-meta{
    padding:8px 10px 10px;
    border-bottom-width:5px;
  }

  .nutrition-meta p{
    font-size:13px;
  }

  .nutrition-grid{
    font-size:11px;
  }

  .nutrition-grid > div{
    padding:3px 5px;
  }

  .nutrition-grid .main{
    font-size:18px;
    border-bottom-width:5px;
  }

  .nutrition-grid .nutrient-col{
    font-size:11px;
    border-bottom-width:5px;
  }

  .nutrition-grid .nutrient-col strong{
    font-size:12px;
  }
}

/* ============================================================
   LUMARA PREMIUM - FAQ RESPONSIVE
   ============================================================ */

.faq.faq-premium{
  max-width:none!important;
  margin:0!important;
  padding:64px 6%!important;
  display:grid;
  grid-template-columns:minmax(260px,.78fr) minmax(420px,1.22fr);
  gap:64px;
  align-items:start;
  text-align:left!important;
  background:#f4f8ee;
}

.faq-premium .faq-left{
  max-width:420px;
}

.faq-premium .faq-left h2{
  margin:0 0 28px!important;
  text-align:left!important;
  color:var(--lumara-olive-dark);
  font-size:clamp(30px,3vw,44px);
  line-height:1;
  letter-spacing:-.04em;
}

.faq-premium .faq-left h3{
  margin:0 0 20px;
  color:var(--lumara-olive-dark);
  font-size:clamp(25px,2.7vw,36px);
  line-height:1.04;
  letter-spacing:-.045em;
}

.faq-premium .faq-left p{
  margin:0 0 28px;
  color:#5d6658;
  font-size:20px;
  line-height:1.25;
  font-weight:500;
}

.faq-contact-btn{
  appearance:none;
  border:0;
  background:#030303;
  color:#fff;
  border-radius:999px;
  padding:16px 28px;
  font-size:17px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 14px 28px rgba(0,0,0,.12);
  transition:transform .16s ease, filter .16s ease;
}

.faq-contact-btn:hover{
  transform:translateY(-2px);
  filter:brightness(1.08);
}

.faq-list{
  display:grid;
  gap:10px;
}

.faq-premium details{
  margin:0!important;
  background:var(--lumara-olive-dark)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:12px!important;
  padding:0!important;
  overflow:hidden;
  box-shadow:none!important;
}

.faq-premium summary{
  list-style:none;
  position:relative;
  padding:18px 58px 18px 24px;
  color:#fff;
  font-size:20px;
  font-weight:800;
  line-height:1.15;
  cursor:pointer;
}

.faq-premium summary::-webkit-details-marker{
  display:none;
}

.faq-premium summary::after{
  content:"+";
  position:absolute;
  right:24px;
  top:50%;
  transform:translateY(-50%);
  color:#fff;
  font-size:28px;
  line-height:1;
  font-weight:600;
}

.faq-premium details[open] summary::after{
  content:"−";
}

.faq-premium details p{
  margin:0;
  padding:0 24px 20px;
  color:rgba(255,255,255,.86);
  font-size:18px;
  line-height:1.25;
  font-weight:500;
}

@media(max-width:920px){
  .faq.faq-premium{
    grid-template-columns:1fr;
    gap:28px;
    padding:46px 5%!important;
  }

  .faq-premium .faq-left{
    max-width:720px;
    text-align:center;
    margin:0 auto;
  }

  .faq-premium .faq-left h2,
  .faq-premium .faq-left h3{
    text-align:center!important;
  }

  .faq-premium .faq-left p{
    font-size:18px;
    max-width:560px;
    margin-left:auto;
    margin-right:auto;
  }

  .faq-contact-btn{
    width:min(280px,100%);
  }
}

@media(max-width:560px){
  .faq.faq-premium{
    padding:38px 5%!important;
    gap:22px;
  }

  .faq-premium .eyebrow{
    font-size:12px;
  }

  .faq-premium .faq-left h2{
    font-size:32px;
    margin-bottom:22px!important;
  }

  .faq-premium .faq-left h3{
    font-size:27px;
  }

  .faq-premium .faq-left p{
    font-size:16px;
    line-height:1.35;
  }

  .faq-contact-btn{
    padding:14px 22px;
    font-size:15px;
  }

  .faq-list{
    gap:8px;
  }

  .faq-premium summary{
    padding:15px 46px 15px 16px;
    font-size:16px;
  }

  .faq-premium summary::after{
    right:16px;
    font-size:24px;
  }

  .faq-premium details p{
    padding:0 16px 16px;
    font-size:15px;
    line-height:1.35;
  }
}


/* ===== MODO DE USO + TICKER ===== */
.usage-section{
  display:grid;
  grid-template-columns:minmax(320px, 520px) minmax(320px, 1fr);
  gap:56px;
  align-items:center;
  padding:34px 7% 12px;
  background:#eef2e6;
}
.usage-video-wrap{display:flex;justify-content:center;}
.usage-video-card{
  width:100%;
  max-width:460px;
  border-radius:28px;
  overflow:hidden;
  background:#000;
  box-shadow:0 18px 48px rgba(31,39,20,.16);
}
.usage-video{
  display:block;
  width:100%;
  aspect-ratio: 4 / 5;
  object-fit:cover;
  background:#000;
}
.usage-copy .eyebrow{margin-bottom:10px;}
.usage-copy h2{
  margin:0 0 16px;
  font-size:clamp(38px,4.3vw,66px);
  line-height:0.95;
  font-weight:900;
  color:#627147;
}
.usage-copy h3{
  margin:0 0 28px;
  max-width:620px;
  font-size:clamp(24px,2.2vw,44px);
  line-height:1.08;
  color:#5b684f;
  font-weight:800;
}
.usage-steps{display:grid;gap:22px;margin:0 0 28px;}
.usage-step{
  display:grid;
  grid-template-columns:72px 1fr;
  gap:18px;
  align-items:start;
}
.usage-step span{
  font-size:58px;
  line-height:0.9;
  font-weight:900;
  color:#748655;
}
.usage-step p{
  margin:8px 0 0;
  font-size:20px;
  line-height:1.24;
  color:#5c635a;
}
.ticker-board{
  background:#050505;
  color:#f8f8f2;
  overflow:hidden;
  padding:16px 0 18px;
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.ticker-board__viewport{overflow:hidden;}
.ticker-board__track{
  display:flex;
  align-items:center;
  width:max-content;
  gap:0;
  white-space:nowrap;
  animation:lumaraTicker 38s linear infinite;
  will-change:transform;
}
.ticker-board__track span{
  position:relative;
  display:inline-flex;
  align-items:center;
  padding:0 34px;
  font-size:18px;
  font-weight:700;
  letter-spacing:.02em;
}
.ticker-board__track span::after{
  content:'»';
  margin-left:34px;
  font-size:26px;
  line-height:1;
  color:#9bad67;
  font-weight:900;
}
@keyframes lumaraTicker{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}
@media (max-width: 1120px){
  .usage-section{
    grid-template-columns:1fr;
    gap:28px;
    padding:28px 6% 10px;
  }
  .usage-video-card{max-width:540px;}
  .usage-copy{max-width:760px;margin:0 auto;}
  .usage-copy h2,
  .usage-copy h3{text-align:left;}
}
@media (max-width: 820px){
  .usage-section{
    padding:24px 5% 8px;
    gap:24px;
  }
  .usage-video-card{
    max-width:100%;
    border-radius:22px;
  }
  .usage-copy h2{
    font-size:40px;
    margin-bottom:12px;
  }
  .usage-copy h3{
    font-size:26px;
    margin-bottom:22px;
  }
  .usage-steps{gap:18px;}
  .usage-step{
    grid-template-columns:56px 1fr;
    gap:14px;
  }
  .usage-step span{font-size:42px;}
  .usage-step p{
    margin-top:4px;
    font-size:18px;
  }
  .ticker-board{padding:14px 0 16px;}
  .ticker-board__track span{
    padding:0 24px;
    font-size:16px;
  }
  .ticker-board__track span::after{
    margin-left:24px;
    font-size:22px;
  }
}
@media (max-width: 560px){
  .usage-section{
    padding:22px 4% 6px;
  }
  .usage-video{
    aspect-ratio: 1 / 1.12;
  }
  .usage-copy h2{
    font-size:32px;
  }
  .usage-copy h3{
    font-size:19px;
    line-height:1.18;
  }
  .usage-step{
    grid-template-columns:46px 1fr;
    gap:12px;
  }
  .usage-step span{font-size:34px;}
  .usage-step p{font-size:16px;line-height:1.24;}
  .usage-copy .olive-btn,
  .usage-copy .primary-btn{width:100%;}
  .ticker-board__track{
    animation-duration: 32s;
  }
  .ticker-board__track span{
    padding:0 18px;
    font-size:15px;
  }
  .ticker-board__track span::after{
    margin-left:18px;
    font-size:18px;
  }
}

/* ============================================================
   AJUSTE FINO - MODO DE USO CENTRADO + VIDEO AUTOPLAY READY
   ============================================================ */

.usage-section{
  width:100%!important;
  max-width:1360px!important;
  margin:0 auto!important;
  padding:52px 6% 0!important;
  justify-content:center!important;
  grid-template-columns:minmax(280px,460px) minmax(420px,620px)!important;
  gap:58px!important;
}

.usage-video-wrap{
  width:100%!important;
  justify-content:flex-end!important;
}

.usage-video-card{
  position:relative!important;
  width:min(100%,440px)!important;
  max-width:440px!important;
  aspect-ratio:4/5!important;
  border-radius:28px!important;
  overflow:hidden!important;
  background:#101010!important;
}

.usage-video,
.usage-video-fallback{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}

.usage-video-fallback{
  z-index:1;
}

.usage-video.has-video{
  z-index:2;
}

.usage-copy{
  max-width:620px!important;
}

.usage-copy h2{
  margin-top:0!important;
}

.ticker-board{
  margin-top:0!important;
}

@media(max-width:1120px){
  .usage-section{
    grid-template-columns:1fr!important;
    max-width:820px!important;
    gap:28px!important;
    padding:40px 5% 0!important;
  }

  .usage-video-wrap{
    justify-content:center!important;
  }

  .usage-video-card{
    width:min(100%,520px)!important;
    max-width:520px!important;
    aspect-ratio:1/1!important;
  }

  .usage-copy{
    max-width:720px!important;
    margin:0 auto!important;
    text-align:center!important;
  }

  .usage-copy h2,
  .usage-copy h3{
    text-align:center!important;
  }

  .usage-step{
    text-align:left!important;
  }

  .usage-copy .olive-btn{
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

@media(max-width:560px){
  .usage-section{
    padding:30px 4% 0!important;
    gap:22px!important;
  }

  .usage-video-card{
    border-radius:22px!important;
    aspect-ratio:1/1.05!important;
  }

  .usage-copy{
    text-align:left!important;
  }

  .usage-copy h2,
  .usage-copy h3{
    text-align:left!important;
  }
}

/* ============================================================
   AJUSTE FINAL - Organización sección MODO DE USO
   Más ancho en escritorio, centrado real y responsive.
   ============================================================ */

.usage-section{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:76px 7% 0!important;
  display:grid!important;
  grid-template-columns:minmax(420px,560px) minmax(520px,760px)!important;
  gap:76px!important;
  align-items:center!important;
  justify-content:center!important;
  background:#eef2e6!important;
}

.usage-video-wrap{
  width:100%!important;
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
}

.usage-video-card{
  width:100%!important;
  max-width:560px!important;
  aspect-ratio:4/5!important;
  border-radius:32px!important;
  overflow:hidden!important;
  background:#101010!important;
  box-shadow:0 26px 70px rgba(31,39,20,.18)!important;
}

.usage-video,
.usage-video-fallback{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}

.usage-copy{
  width:100%!important;
  max-width:760px!important;
}

.usage-copy .eyebrow{
  display:block!important;
  margin-bottom:12px!important;
}

.usage-copy h2{
  margin:0 0 18px!important;
  font-size:clamp(56px,5vw,86px)!important;
  line-height:.88!important;
  color:#617047!important;
  letter-spacing:-.055em!important;
}

.usage-copy h3{
  margin:0 0 34px!important;
  max-width:720px!important;
  font-size:clamp(34px,3vw,54px)!important;
  line-height:1.04!important;
  color:#56634a!important;
  letter-spacing:-.05em!important;
}

.usage-steps{
  display:grid!important;
  gap:26px!important;
  margin:0 0 34px!important;
}

.usage-step{
  display:grid!important;
  grid-template-columns:82px 1fr!important;
  gap:22px!important;
  align-items:start!important;
}

.usage-step span{
  font-size:64px!important;
  line-height:.9!important;
  color:#718553!important;
  font-weight:900!important;
}

.usage-step p{
  margin:10px 0 0!important;
  font-size:22px!important;
  line-height:1.28!important;
  color:#5c6359!important;
}

.usage-copy .olive-btn{
  min-width:240px!important;
  padding:18px 36px!important;
}

.ticker-board{
  width:100%!important;
  margin:0!important;
  padding:18px 0!important;
}

/* En pantallas medianas, apila y mantiene buena proporción */
@media(max-width:1180px){
  .usage-section{
    grid-template-columns:1fr!important;
    max-width:none!important;
    padding:58px 6% 0!important;
    gap:36px!important;
  }

  .usage-video-wrap{
    justify-content:center!important;
  }

  .usage-video-card{
    max-width:680px!important;
    aspect-ratio:16/10!important;
  }

  .usage-copy{
    max-width:780px!important;
    margin:0 auto!important;
    text-align:center!important;
  }

  .usage-copy h2,
  .usage-copy h3{
    text-align:center!important;
  }

  .usage-step{
    max-width:680px!important;
    margin:0 auto!important;
    text-align:left!important;
  }
}

/* Móvil */
@media(max-width:640px){
  .usage-section{
    padding:38px 5% 0!important;
    gap:26px!important;
  }

  .usage-video-card{
    max-width:100%!important;
    aspect-ratio:1/1.05!important;
    border-radius:24px!important;
  }

  .usage-copy{
    text-align:left!important;
  }

  .usage-copy h2,
  .usage-copy h3{
    text-align:left!important;
  }

  .usage-copy h2{
    font-size:40px!important;
    line-height:.95!important;
  }

  .usage-copy h3{
    font-size:22px!important;
    line-height:1.15!important;
    margin-bottom:24px!important;
  }

  .usage-steps{
    gap:18px!important;
  }

  .usage-step{
    grid-template-columns:50px 1fr!important;
    gap:14px!important;
    max-width:none!important;
  }

  .usage-step span{
    font-size:38px!important;
  }

  .usage-step p{
    margin-top:4px!important;
    font-size:16px!important;
  }

  .usage-copy .olive-btn{
    width:100%!important;
    min-width:0!important;
  }

  .ticker-board{
    padding:14px 0!important;
  }
}

/* ============================================================
   AJUSTE FINO - Separación botón modo de uso vs tablero negro
   ============================================================ */

.usage-section{
  padding-bottom:52px!important;
}

.usage-copy .olive-btn{
  margin-bottom:0!important;
}

.ticker-board{
  margin-top:0!important;
}

@media(max-width:820px){
  .usage-section{
    padding-bottom:38px!important;
  }
}

@media(max-width:560px){
  .usage-section{
    padding-bottom:32px!important;
  }
}

/* ============================================================
   LUMARA HEADER LIMPIO + MENSAJES SUPERIORES
   ============================================================ */

.announcement-bar{
  position:sticky;
  top:0;
  z-index:60;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#dfe8d5;
  color:#566344;
  font-size:18px;
  font-weight:700;
  letter-spacing:-.02em;
  overflow:hidden;
  text-align:center;
}

.announcement-bar span{
  position:absolute;
  inset:auto 16px;
  opacity:0;
  transform:translateY(8px);
  animation:lumaraAnnouncement 16s infinite;
  white-space:nowrap;
}

.announcement-bar span:nth-child(1){animation-delay:0s;}
.announcement-bar span:nth-child(2){animation-delay:4s;}
.announcement-bar span:nth-child(3){animation-delay:8s;}
.announcement-bar span:nth-child(4){animation-delay:12s;}

@keyframes lumaraAnnouncement{
  0%, 3%{
    opacity:0;
    transform:translateY(8px);
    filter:blur(4px);
  }
  8%, 22%{
    opacity:1;
    transform:translateY(0);
    filter:blur(0);
  }
  27%, 100%{
    opacity:0;
    transform:translateY(-8px);
    filter:blur(4px);
  }
}

.topbar.lumara-clean-header{
  position:sticky!important;
  top:42px!important;
  z-index:55!important;
  min-height:92px!important;
  padding:18px 6%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  background:rgba(255,255,255,.96)!important;
  border-bottom:1px solid rgba(86,99,68,.08)!important;
  box-shadow:0 10px 30px rgba(31,39,20,.05)!important;
  backdrop-filter:blur(10px);
}

.brand-logo{
  display:inline-flex!important;
  align-items:center!important;
  width:auto!important;
  text-decoration:none!important;
}

.brand-logo img{
  display:block!important;
  width:210px!important;
  max-width:100%!important;
  height:auto!important;
  object-fit:contain!important;
}

/* Evita estilos antiguos de texto sobre el logo */
.brand.brand-logo{
  font-size:0!important;
  line-height:0!important;
  letter-spacing:0!important;
}

@media(max-width:820px){
  .announcement-bar{
    height:36px;
    font-size:13px;
    padding:0 12px;
  }

  .announcement-bar span{
    inset:auto 10px;
    white-space:normal;
    line-height:1.15;
  }

  .topbar.lumara-clean-header{
    top:36px!important;
    min-height:70px!important;
    padding:12px 5%!important;
    align-items:center!important;
    flex-direction:row!important;
  }

  .brand-logo img{
    width:154px!important;
  }
}

@media(max-width:420px){
  .announcement-bar{
    font-size:12px;
  }

  .topbar.lumara-clean-header{
    min-height:64px!important;
  }

  .brand-logo img{
    width:138px!important;
  }
}

@media (prefers-reduced-motion: reduce){
  .announcement-bar span{
    animation:none!important;
    opacity:1;
    transform:none;
    filter:none;
  }

  .announcement-bar span:not(:first-child){
    display:none;
  }
}

/* ============================================================
   AJUSTE FINO HEADER - Logo más elegante y nítido
   ============================================================ */

.topbar.lumara-clean-header{
  min-height:72px!important;
  padding:12px 6%!important;
  align-items:center!important;
}

.brand-logo img{
  width:150px!important;
  height:auto!important;
  image-rendering:auto!important;
  object-fit:contain!important;
  filter:none!important;
  transform:translateZ(0);
}

.announcement-bar{
  height:36px!important;
  font-size:16px!important;
}

.topbar.lumara-clean-header{
  top:36px!important;
}

@media(max-width:820px){
  .announcement-bar{
    height:32px!important;
    font-size:12px!important;
  }

  .topbar.lumara-clean-header{
    top:32px!important;
    min-height:58px!important;
    padding:10px 5%!important;
  }

  .brand-logo img{
    width:118px!important;
  }
}

@media(max-width:420px){
  .topbar.lumara-clean-header{
    min-height:54px!important;
  }

  .brand-logo img{
    width:108px!important;
  }
}

/* ============================================================
   LUMARA - Barra inferior elegante / premium
   ============================================================ */

.sticky-buy{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:18px!important;
  transform:translateX(-50%)!important;
  width:min(1120px, calc(100% - 36px))!important;
  min-height:82px!important;
  padding:14px 18px 14px 22px!important;
  border-radius:24px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  background:rgba(244,248,238,.94)!important;
  border:1px solid rgba(86,99,68,.18)!important;
  box-shadow:
    0 24px 70px rgba(31,39,20,.20),
    0 0 0 1px rgba(255,255,255,.60) inset!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  z-index:80!important;
}

.sticky-buy::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(90deg, rgba(255,255,255,.62), rgba(255,255,255,.20));
}

.sticky-buy > div,
.sticky-buy button{
  position:relative;
  z-index:1;
}

.sticky-buy strong{
  display:block!important;
  margin-bottom:4px!important;
  color:#23291d!important;
  font-size:18px!important;
  font-weight:850!important;
  letter-spacing:-.035em!important;
  line-height:1.05!important;
}

.sticky-buy span{
  display:block!important;
  color:#566344!important;
  font-size:22px!important;
  font-weight:900!important;
  letter-spacing:-.045em!important;
  line-height:1!important;
}

.sticky-buy button{
  min-width:250px!important;
  margin:0!important;
  padding:18px 30px!important;
  border:0!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,#6f814d 0%,#52643a 100%)!important;
  color:#fff!important;
  font-size:20px!important;
  font-weight:900!important;
  letter-spacing:-.02em!important;
  box-shadow:0 16px 34px rgba(82,100,58,.28)!important;
  cursor:pointer!important;
  transition:transform .16s ease, filter .16s ease, box-shadow .16s ease!important;
}

.sticky-buy button::after{
  content:" →";
  display:inline-block;
  margin-left:8px;
  transition:transform .16s ease;
}

.sticky-buy button:hover{
  transform:translateY(-2px)!important;
  filter:brightness(1.05)!important;
  box-shadow:0 20px 40px rgba(82,100,58,.34)!important;
}

.sticky-buy button:hover::after{
  transform:translateX(4px);
}

@media(max-width:720px){
  .sticky-buy{
    bottom:10px!important;
    width:calc(100% - 20px)!important;
    min-height:72px!important;
    padding:12px 12px 12px 14px!important;
    border-radius:20px!important;
    gap:10px!important;
  }

  .sticky-buy strong{
    font-size:14px!important;
    max-width:190px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .sticky-buy span{
    font-size:18px!important;
  }

  .sticky-buy button{
    min-width:148px!important;
    padding:15px 18px!important;
    border-radius:16px!important;
    font-size:15px!important;
    white-space:nowrap!important;
  }
}

@media(max-width:390px){
  .sticky-buy{
    padding:10px!important;
  }

  .sticky-buy strong{
    font-size:13px!important;
    max-width:150px!important;
  }

  .sticky-buy span{
    font-size:16px!important;
  }

  .sticky-buy button{
    min-width:132px!important;
    padding:14px 14px!important;
    font-size:14px!important;
  }
}


/* ============================================================
   LUMARA PERFORMANCE - Fluidez PC/Móvil
   ============================================================ */
html{scroll-behavior:smooth;}
body{overflow-x:hidden;}
img,video{max-width:100%;height:auto;}
.hero-image,.hero-thumb img,.routine-media img,.usage-video,.usage-video-fallback{content-visibility:auto;}
.hero-main-frame,.hero-gallery,.routine-section,.compare-section,.nutrition-section,.usage-section,.faq-premium{contain:layout paint style;}
/* Evita trabajo de render en secciones lejanas sin romper layout */
.compare-section,.nutrition-section,.usage-section,.faq-premium{content-visibility:auto;contain-intrinsic-size:900px;}
/* Menos blur/sombras en móvil para que no se sienta pesado */
@media(max-width:720px){
  .hero-main-frame,.hero-thumb,.routine-media img,.nutrition-card,.compare-table,.usage-video-card,.checkout-dialog,.sticky-buy{box-shadow:0 10px 26px rgba(31,39,20,.10)!important;}
  .checkout-overlay,.topbar,.sticky-buy{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
  .hero.hero-premium{padding-top:20px!important;}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important;}
}

/* ============================================================
   LUMARA FINAL - VIDEO REAL + INGREDIENTES + FLUIDEZ
   ============================================================ */

html{
  scroll-behavior:smooth;
}

img, video{
  max-width:100%;
}

.hero,
.routine-section,
.compare-section,
.ingredients-section,
.nutrition-section,
.usage-section,
.faq-premium{
  content-visibility:auto;
  contain-intrinsic-size: 900px;
}

/* -------- Ingredientes -------- */
.ingredients-section{
  background:#eef5e5!important;
  padding:62px 6%!important;
}

.ingredients-inner{
  position:relative;
  width:min(1180px,100%);
  margin:0 auto;
  padding:56px clamp(24px,4vw,66px);
  border-radius:38px;
  background:#dceccd;
  border:1px solid rgba(86,99,68,.16);
  overflow:hidden;
  box-shadow:0 22px 56px rgba(31,39,20,.08);
}

.ingredients-orb{
  position:absolute;
  width:260px;
  height:260px;
  top:-108px;
  right:-62px;
  border-radius:50%;
  background:rgba(255,255,255,.34);
  pointer-events:none;
}

.ingredients-heading{
  position:relative;
  z-index:1;
  margin-bottom:36px;
}

.ingredients-heading h2{
  margin:0 0 18px;
  font-size:clamp(44px,5.5vw,92px);
  line-height:.88;
  letter-spacing:-.06em;
  color:#536247;
  font-weight:900;
}

.ingredients-heading p{
  margin:0;
  color:#5b6655;
  font-size:clamp(18px,1.7vw,28px);
  line-height:1.25;
  font-weight:700;
}

.ingredients-list{
  position:relative;
  z-index:1;
  display:grid;
  gap:16px;
}

.ingredients-list details{
  margin:0!important;
  padding:0!important;
  border:1px solid rgba(86,99,68,.13)!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.46)!important;
  box-shadow:0 12px 28px rgba(31,39,20,.05)!important;
  overflow:hidden;
}

.ingredients-list summary{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:16px;
  align-items:center;
  padding:19px 22px;
  list-style:none;
  cursor:pointer;
}

.ingredients-list summary::-webkit-details-marker{
  display:none;
}

.ingredient-number{
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#4f5f49;
  color:#fff;
  font-weight:900;
  font-size:18px;
}

.ingredients-list strong{
  color:#4f5c4d;
  font-size:clamp(20px,2vw,32px);
  line-height:1;
  font-weight:850;
  letter-spacing:-.035em;
}

.ingredients-list i{
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(86,99,68,.10);
  color:#4f5f49;
  font-style:normal;
  font-size:34px;
  line-height:1;
  transition:transform .18s ease;
}

.ingredients-list details[open] i{
  transform:rotate(45deg);
}

.ingredients-list p{
  margin:0;
  padding:0 24px 22px 80px;
  color:#5d6658;
  font-size:17px;
  line-height:1.45;
}

/* -------- Modo de uso video real -------- */
.usage-section{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:76px 7% 52px!important;
  display:grid!important;
  grid-template-columns:minmax(420px,560px) minmax(520px,760px)!important;
  gap:76px!important;
  align-items:center!important;
  justify-content:center!important;
  background:#eef2e6!important;
  contain-intrinsic-size: 780px;
}

.usage-video-wrap{
  width:100%!important;
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
}

.usage-video-card{
  width:100%!important;
  max-width:560px!important;
  aspect-ratio:4/5!important;
  border-radius:32px!important;
  overflow:hidden!important;
  background:#101010!important;
  box-shadow:0 26px 70px rgba(31,39,20,.15)!important;
  transform:translateZ(0);
}

.usage-video{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}

.usage-copy{
  width:100%!important;
  max-width:760px!important;
}

.usage-copy h2{
  margin:0 0 18px!important;
  font-size:clamp(56px,5vw,86px)!important;
  line-height:.88!important;
  color:#617047!important;
  letter-spacing:-.055em!important;
}

.usage-copy h3{
  margin:0 0 34px!important;
  max-width:720px!important;
  font-size:clamp(34px,3vw,54px)!important;
  line-height:1.04!important;
  color:#56634a!important;
  letter-spacing:-.05em!important;
}

.usage-steps{
  display:grid!important;
  gap:26px!important;
  margin:0 0 34px!important;
}

.usage-step{
  display:grid!important;
  grid-template-columns:82px 1fr!important;
  gap:22px!important;
  align-items:start!important;
}

.usage-step span{
  font-size:64px!important;
  line-height:.9!important;
  color:#718553!important;
  font-weight:900!important;
}

.usage-step p{
  margin:10px 0 0!important;
  font-size:22px!important;
  line-height:1.28!important;
  color:#5c6359!important;
}

.ticker-board{
  width:100%!important;
  margin:0!important;
  padding:18px 0!important;
  background:#050505!important;
  overflow:hidden!important;
}

.ticker-board__track{
  display:flex;
  align-items:center;
  width:max-content;
  white-space:nowrap;
  animation:lumaraTicker 40s linear infinite;
  will-change:transform;
}

.ticker-board__track span{
  display:inline-flex;
  align-items:center;
  padding:0 34px;
  color:#fff;
  font-size:18px;
  font-weight:800;
}

.ticker-board__track span::after{
  content:"»";
  margin-left:34px;
  color:#9bad67;
  font-size:25px;
  font-weight:900;
}

@keyframes lumaraTicker{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}

/* -------- Optimización visual móvil -------- */
@media(max-width:1180px){
  .usage-section{
    grid-template-columns:1fr!important;
    padding:58px 6% 42px!important;
    gap:36px!important;
  }

  .usage-video-wrap{
    justify-content:center!important;
  }

  .usage-video-card{
    max-width:680px!important;
    aspect-ratio:16/10!important;
  }

  .usage-copy{
    max-width:780px!important;
    margin:0 auto!important;
    text-align:center!important;
  }

  .usage-copy h2,
  .usage-copy h3{
    text-align:center!important;
  }

  .usage-step{
    max-width:680px!important;
    margin:0 auto!important;
    text-align:left!important;
  }
}

@media(max-width:640px){
  .ingredients-section{
    padding:38px 4%!important;
  }

  .ingredients-inner{
    padding:34px 18px;
    border-radius:28px;
  }

  .ingredients-orb{
    width:180px;
    height:180px;
    top:-76px;
    right:-62px;
  }

  .ingredients-heading{
    margin-bottom:24px;
  }

  .ingredients-heading h2{
    font-size:42px;
  }

  .ingredients-heading p{
    font-size:17px;
  }

  .ingredients-list{
    gap:10px;
  }

  .ingredients-list summary{
    grid-template-columns:auto 1fr auto;
    gap:10px;
    padding:14px 14px;
  }

  .ingredient-number{
    width:34px;
    height:34px;
    font-size:14px;
  }

  .ingredients-list strong{
    font-size:21px;
  }

  .ingredients-list i{
    width:36px;
    height:36px;
    font-size:26px;
  }

  .ingredients-list p{
    padding:0 16px 16px 58px;
    font-size:14px;
  }

  .usage-section{
    padding:38px 5% 32px!important;
    gap:26px!important;
  }

  .usage-video-card{
    max-width:100%!important;
    aspect-ratio:1/1.05!important;
    border-radius:24px!important;
    box-shadow:0 16px 38px rgba(31,39,20,.12)!important;
  }

  .usage-copy{
    text-align:left!important;
  }

  .usage-copy h2,
  .usage-copy h3{
    text-align:left!important;
  }

  .usage-copy h2{
    font-size:40px!important;
    line-height:.95!important;
  }

  .usage-copy h3{
    font-size:22px!important;
    line-height:1.15!important;
    margin-bottom:24px!important;
  }

  .usage-steps{
    gap:18px!important;
  }

  .usage-step{
    grid-template-columns:50px 1fr!important;
    gap:14px!important;
    max-width:none!important;
  }

  .usage-step span{
    font-size:38px!important;
  }

  .usage-step p{
    margin-top:4px!important;
    font-size:16px!important;
  }

  .usage-copy .olive-btn{
    width:100%!important;
    min-width:0!important;
  }

  .ticker-board{
    padding:14px 0!important;
  }

  .ticker-board__track{
    animation-duration:32s;
  }

  .ticker-board__track span{
    padding:0 18px;
    font-size:15px;
  }

  .ticker-board__track span::after{
    margin-left:18px;
    font-size:18px;
  }

  .hero,
  .routine-section,
  .compare-section,
  .ingredients-section,
  .nutrition-section,
  .usage-section,
  .faq-premium{
    content-visibility:visible;
  }
}

@media (prefers-reduced-motion: reduce){
  .ticker-board__track{
    animation:none!important;
  }
}


/* ===== Hero CTA y mensajes premium ===== */
.hero-content{
  max-width: 560px;
}

.hero-cta{
  width: min(100%, 480px);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 76px;
  padding: 22px 34px;
  margin: 22px 0 20px;
  border-radius: 24px;
  background: linear-gradient(135deg, #7f9251 0%, #64763d 100%) !important;
  color: #fff !important;
  box-shadow: 0 18px 34px rgba(92, 109, 54, 0.24);
  letter-spacing: -.02em;
  font-size: clamp(19px, 2vw, 25px);
  font-weight: 900;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.hero-cta:hover{
  transform: translateY(-1px);
  filter: brightness(1.03);
  box-shadow: 0 22px 40px rgba(92, 109, 54, 0.28);
}
.hero-cta:active{
  transform: translateY(0);
}

.premium-trust-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  width: min(100%, 520px);
}
.premium-trust-grid .trust-pill:last-child{
  grid-column: 1 / -1;
}

.trust-pill{
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 74px;
  padding: 14px 16px;
  border-radius: 22px;
  background: rgba(255,255,255,0.88);
  border: 1px solid rgba(111,129,73,0.18);
  box-shadow: 0 10px 22px rgba(25,33,14,0.06);
}
.trust-icon{
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #edf4df;
  font-size: 20px;
}
.trust-copy{
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.trust-copy strong{
  color: #536247;
  font-size: 16px;
  line-height: 1.1;
  font-weight: 900;
  letter-spacing: -.02em;
}
.trust-copy small{
  color: #66715f;
  font-size: 12.5px;
  line-height: 1.25;
  font-weight: 600;
}

@media (max-width: 1024px){
  .hero-content{max-width:none;}
  .hero-cta,
  .premium-trust-grid{width:100%;}
}

@media (max-width: 640px){
  .hero-cta{
    min-height: 66px;
    padding: 18px 20px;
    border-radius: 20px;
    font-size: 18px;
  }
  .premium-trust-grid{
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .premium-trust-grid .trust-pill:last-child{
    grid-column: auto;
  }
  .trust-pill{
    min-height: 68px;
    padding: 12px 14px;
    border-radius: 18px;
  }
  .trust-icon{
    width: 38px;
    height: 38px;
    flex-basis: 38px;
    font-size: 18px;
  }
  .trust-copy strong{font-size: 15px;}
  .trust-copy small{font-size: 12px;}
}

/* ============================================================
   LUMARA - Precio hero con incentivo de descuento
   ============================================================ */

.hero-price-box{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:22px!important;
  margin:20px 0 12px!important;
}

.hero-price-label{
  display:block;
  margin-bottom:4px;
  color:#627047;
  font-size:14px;
  font-weight:900;
  letter-spacing:.02em;
  text-transform:uppercase;
}

.hero-discount-badge{
  max-width:220px;
  padding:14px 16px;
  border-radius:18px;
  background:linear-gradient(135deg,#b7ee35 0%,#d8ff7a 100%);
  color:#14200f;
  box-shadow:0 14px 28px rgba(116,134,69,.18);
  transform:rotate(-1deg);
}

.hero-discount-badge strong{
  display:block;
  font-size:18px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.035em;
}

.hero-discount-badge small{
  display:block;
  margin-top:4px;
  font-size:12px;
  line-height:1.1;
  font-weight:800;
  color:#42502f;
}

.hero-savings-box{
  width:min(100%,520px);
  display:flex;
  flex-direction:column;
  gap:4px;
  margin:0 0 14px;
  padding:14px 18px;
  border-radius:18px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(111,129,73,.18);
  box-shadow:0 10px 24px rgba(31,39,20,.05);
}

.hero-savings-box span{
  color:#5b6846;
  font-size:14px;
  font-weight:850;
}

.hero-savings-box strong{
  color:#151812;
  font-size:17px;
  line-height:1.18;
  font-weight:900;
  letter-spacing:-.03em;
}

.hero-cta{
  margin-top:16px!important;
}

@media(max-width:820px){
  .hero-price-box{
    align-items:flex-start!important;
    gap:14px!important;
  }

  .hero-discount-badge{
    max-width:190px;
    padding:12px 14px;
  }

  .hero-discount-badge strong{
    font-size:16px;
  }
}

@media(max-width:560px){
  .hero-price-box{
    flex-direction:column!important;
    gap:12px!important;
  }

  .hero-discount-badge{
    width:100%;
    max-width:none;
    transform:none;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
  }

  .hero-discount-badge strong{
    font-size:15px;
  }

  .hero-discount-badge small{
    margin-top:0;
    font-size:11px;
    text-align:right;
  }

  .hero-savings-box{
    padding:13px 14px;
    border-radius:16px;
  }

  .hero-savings-box strong{
    font-size:15px;
  }
}

/* ============================================================
   LUMARA - Footer premium + modal informativo
   ============================================================ */

.lumara-footer{
  position:relative;
  overflow:hidden;
  padding:76px 7% 28px;
  background:
    radial-gradient(circle at 90% 20%, rgba(247,215,214,.55), transparent 34%),
    linear-gradient(135deg,#f5f2e9 0%,#fbf8f4 58%,#f6eeee 100%);
  color:#566154;
}

.lumara-footer-bg-leaf{
  position:absolute;
  left:-70px;
  top:40px;
  width:210px;
  height:310px;
  border-radius:100% 0 100% 0;
  background:rgba(103,118,74,.10);
  transform:rotate(25deg);
  pointer-events:none;
}

.lumara-footer-grid{
  position:relative;
  z-index:1;
  width:min(1180px,100%);
  margin:0 auto 42px;
  display:grid;
  grid-template-columns:minmax(300px,420px) 1fr 1fr;
  gap:64px;
  align-items:start;
}

.lumara-footer-card{
  padding:38px 36px;
  border-radius:28px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(103,118,74,.12);
  box-shadow:0 24px 60px rgba(31,39,20,.08);
  backdrop-filter:blur(14px);
}

.lumara-footer-logo{
  width:158px;
  height:auto;
  display:block;
  margin-bottom:24px;
}

.lumara-footer-card p{
  margin:0 0 24px;
  color:#5d675a;
  font-size:18px;
  line-height:1.55;
  font-weight:500;
}

.lumara-footer-badges{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-bottom:28px;
}

.lumara-footer-badges span{
  width:max-content;
  max-width:100%;
  padding:8px 14px;
  border-radius:999px;
  background:#e7f1dc;
  color:#617443;
  font-size:14px;
  font-weight:850;
}

.lumara-socials{
  display:flex;
  gap:12px;
}

.lumara-socials a{
  width:46px;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(103,118,74,.14);
  color:#607044;
  font-size:24px;
  font-weight:900;
  text-decoration:none;
  box-shadow:0 10px 22px rgba(31,39,20,.06);
  transition:transform .18s ease, background .18s ease;
}

.lumara-socials a:hover{
  transform:translateY(-2px);
  background:#eef5e5;
}

.lumara-footer-links h3{
  margin:0 0 24px;
  color:#20251c;
  font-size:19px;
  font-weight:900;
}

.lumara-footer-links{
  display:flex;
  flex-direction:column;
  gap:19px;
  padding-top:8px;
}

.lumara-footer-links a{
  color:#626d62;
  text-decoration:none;
  font-size:18px;
  font-weight:500;
  transition:color .16s ease, transform .16s ease;
}

.lumara-footer-links a:hover{
  color:#607044;
  transform:translateX(3px);
}

.lumara-footer-bottom{
  position:relative;
  z-index:1;
  width:min(1180px,100%);
  margin:0 auto;
  padding-top:24px;
  border-top:1px solid rgba(103,118,74,.16);
  color:#657063;
  font-size:15px;
}

/* Modal informativo del footer */
.info-modal{
  position:fixed;
  inset:0;
  z-index:140;
  display:none;
}

.info-modal.active{
  display:block;
}

.info-modal-overlay{
  position:absolute;
  inset:0;
  background:rgba(17,20,14,.56);
  backdrop-filter:blur(5px);
}

.info-modal-dialog{
  position:relative;
  width:min(680px,calc(100% - 32px));
  max-height:calc(100vh - 48px);
  overflow:auto;
  margin:24px auto;
  padding:34px;
  border-radius:28px;
  background:#fbfbf7;
  border:1px solid rgba(103,118,74,.18);
  box-shadow:0 34px 90px rgba(0,0,0,.28);
}

.info-modal-close{
  position:absolute;
  top:18px;
  right:20px;
  width:46px;
  height:46px;
  border:0;
  border-radius:999px;
  background:#eef1ea;
  color:#20251c;
  font-size:32px;
  line-height:1;
  cursor:pointer;
}

.info-modal-dialog h2{
  margin:0 56px 18px 0;
  color:#536247;
  font-size:34px;
  line-height:1;
  letter-spacing:-.04em;
}

.info-modal-body{
  color:#586355;
  font-size:17px;
  line-height:1.55;
}

.info-modal-body p{
  margin:0 0 14px;
}

.info-modal-body ul{
  margin:10px 0 0;
  padding-left:20px;
}

.info-modal-body li{
  margin:8px 0;
}

.info-modal-body .modal-action{
  display:inline-flex;
  margin-top:14px;
  padding:13px 20px;
  border-radius:999px;
  background:#607044;
  color:#fff;
  font-weight:850;
  text-decoration:none;
}

@media(max-width:900px){
  .lumara-footer{
    padding:56px 5% 24px;
  }

  .lumara-footer-grid{
    grid-template-columns:1fr;
    gap:34px;
  }

  .lumara-footer-card{
    padding:30px 24px;
  }

  .lumara-footer-links{
    gap:14px;
  }

  .lumara-footer-links h3{
    margin-bottom:8px;
  }

  .lumara-footer-links a{
    font-size:16px;
  }
}

@media(max-width:520px){
  .lumara-footer{
    padding:42px 4% 22px;
  }

  .lumara-footer-card{
    border-radius:24px;
    padding:26px 20px;
  }

  .lumara-footer-logo{
    width:132px;
  }

  .lumara-footer-card p{
    font-size:16px;
  }

  .lumara-footer-badges span{
    font-size:13px;
  }

  .info-modal-dialog{
    margin:0;
    width:100%;
    min-height:100vh;
    max-height:100vh;
    border-radius:0;
    padding:30px 22px;
  }

  .info-modal-dialog h2{
    font-size:28px;
  }

  .info-modal-body{
    font-size:16px;
  }
}

/* ============================================================
   LUMARA - Botón flotante WhatsApp premium
   PC: alargado / Móvil: circular
   ============================================================ */

.lumara-whatsapp-float{
  position:fixed;
  left:28px;
  bottom:112px;
  z-index:95;
  display:inline-flex;
  align-items:center;
  gap:12px;
  min-width:214px;
  min-height:62px;
  padding:10px 20px 10px 14px;
  border-radius:999px;
  background:linear-gradient(135deg,#6f814d 0%,#53673a 100%);
  color:#fff;
  text-decoration:none;
  box-shadow:
    0 18px 38px rgba(83,103,58,.28),
    0 0 0 1px rgba(255,255,255,.22) inset;
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
  -webkit-tap-highlight-color:transparent;
}

.lumara-whatsapp-float:hover{
  transform:translateY(-2px);
  filter:brightness(1.05);
  box-shadow:
    0 22px 46px rgba(83,103,58,.34),
    0 0 0 1px rgba(255,255,255,.28) inset;
}

.lumara-whatsapp-icon{
  width:42px;
  height:42px;
  min-width:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(255,255,255,.15);
}

.lumara-whatsapp-icon svg{
  width:30px;
  height:30px;
  display:block;
  fill:#fff;
}

.lumara-whatsapp-text{
  display:flex;
  flex-direction:column;
  line-height:1.02;
}

.lumara-whatsapp-text strong{
  color:#fff;
  font-size:18px;
  font-weight:950;
  letter-spacing:-.02em;
}

.lumara-whatsapp-text small{
  margin-top:3px;
  color:rgba(255,255,255,.88);
  font-size:13px;
  font-weight:800;
}

@media(max-width:820px){
  .lumara-whatsapp-float{
    left:auto;
    right:18px;
    bottom:92px;
    min-width:0;
    width:58px;
    height:58px;
    min-height:58px;
    padding:0;
    justify-content:center;
    gap:0;
    border-radius:50%;
    background:#5f7f3d;
    box-shadow:
      0 14px 30px rgba(83,103,58,.30),
      0 0 0 1px rgba(255,255,255,.25) inset;
  }

  .lumara-whatsapp-icon{
    width:58px;
    height:58px;
    min-width:58px;
    background:transparent;
  }

  .lumara-whatsapp-icon svg{
    width:34px;
    height:34px;
  }

  .lumara-whatsapp-text{
    display:none;
  }
}

@media(max-width:420px){
  .lumara-whatsapp-float{
    right:14px;
    bottom:86px;
    width:54px;
    height:54px;
    min-height:54px;
  }

  .lumara-whatsapp-icon{
    width:54px;
    height:54px;
    min-width:54px;
  }

  .lumara-whatsapp-icon svg{
    width:31px;
    height:31px;
  }
}

/* ============================================================
   AJUSTE FINAL - WhatsApp flotante a la derecha elegante
   ============================================================ */

.lumara-whatsapp-float{
  left:auto!important;
  right:28px!important;
  bottom:126px!important;
  min-width:198px!important;
  min-height:60px!important;
  padding:10px 18px 10px 12px!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#6f814d 0%,#52643a 100%)!important;
  box-shadow:
    0 18px 38px rgba(31,39,20,.20),
    0 0 0 1px rgba(255,255,255,.25) inset!important;
}

.lumara-whatsapp-float:hover{
  transform:translateY(-2px)!important;
}

.lumara-whatsapp-icon{
  background:rgba(255,255,255,.16)!important;
}

@media(max-width:820px){
  .lumara-whatsapp-float{
    right:16px!important;
    bottom:96px!important;
    width:56px!important;
    height:56px!important;
    min-width:56px!important;
    min-height:56px!important;
    padding:0!important;
    border-radius:50%!important;
  }
}

@media(max-width:420px){
  .lumara-whatsapp-float{
    right:14px!important;
    bottom:88px!important;
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
    min-height:52px!important;
  }
}

/* ============================================================
   AJUSTE - Iconos reales de redes sociales en footer
   ============================================================ */

.lumara-socials a{
  font-size:0!important;
}

.lumara-socials a svg{
  width:22px;
  height:22px;
  display:block;
  fill:#607044;
  transition:fill .18s ease, transform .18s ease;
}

.lumara-socials a[aria-label*="WhatsApp"] svg{
  width:25px;
  height:25px;
}

.lumara-socials a:hover svg{
  fill:#4f5f36;
  transform:scale(1.04);
}

@media(max-width:520px){
  .lumara-socials a svg{
    width:20px;
    height:20px;
  }

  .lumara-socials a[aria-label*="WhatsApp"] svg{
    width:23px;
    height:23px;
  }
}

/* ============================================================
   LUMARA - Checkout más claro, compacto y confiable
   Mantiene campos obligatorios para Shopify
   ============================================================ */

.checkout-trust-note{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 18px;
  padding:14px 16px;
  border-radius:18px;
  background:#f2f7ec;
  border:1px solid rgba(103,118,74,.18);
  color:#566344;
}

.checkout-trust-note span{
  width:36px;
  height:36px;
  min-width:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#dff0cf;
  font-size:18px;
}

.checkout-trust-note p{
  margin:0;
  font-size:15px;
  line-height:1.25;
  font-weight:750;
}

.form-section-title{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  gap:10px;
  margin:12px 0 2px;
  color:#536247;
}

.form-section-title span{
  width:30px;
  height:30px;
  min-width:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#617044;
  color:#fff;
  font-size:14px;
  font-weight:900;
}

.form-section-title strong{
  font-size:18px;
  font-weight:950;
  letter-spacing:-.03em;
}

.popup-form label{
  color:#151812;
}

.input-icon,
.form-grid select{
  box-shadow:0 8px 18px rgba(31,39,20,.035);
}

.input-icon input::placeholder{
  color:#8a8f88;
}

.checkout-totals div{
  flex-wrap:wrap;
}

.checkout-totals .cod-fee-note,
.cod-fee-note{
  display:block;
  flex:0 0 100%;
  margin-top:2px;
  color:#6a7464;
  font-size:12px;
  line-height:1.25;
  font-weight:650;
  text-align:left;
}

.pay-btn{
  border-radius:16px!important;
  padding:18px 18px!important;
  background:linear-gradient(135deg,#6f814d 0%,#52643a 100%)!important;
  box-shadow:0 18px 34px rgba(82,100,58,.24)!important;
  font-size:22px!important;
  letter-spacing:-.02em!important;
}

.pay-note{
  background:transparent!important;
  color:#536247!important;
  font-size:14px!important;
  line-height:1.35!important;
  padding:0 14px 8px!important;
  margin-top:-4px!important;
  border-radius:0!important;
}

.secure-shipping strong{
  color:#151812;
}

.address-warning{
  border-radius:18px;
  border:1px solid #ffcaca;
  background:#fff2f2;
  padding:16px 12px!important;
}

@media(max-width:720px){
  .checkout-dialog{
    padding:18px 14px!important;
  }

  .checkout-trust-note{
    margin-bottom:14px;
    padding:12px 13px;
    border-radius:16px;
  }

  .checkout-trust-note span{
    width:32px;
    height:32px;
    min-width:32px;
    font-size:16px;
  }

  .checkout-trust-note p{
    font-size:13px;
  }

  .form-section-title{
    margin:10px 0 0;
  }

  .form-section-title span{
    width:26px;
    height:26px;
    min-width:26px;
    font-size:12px;
  }

  .form-section-title strong{
    font-size:16px;
  }

  .popup-form label{
    font-size:14px!important;
    line-height:1.1!important;
    margin-top:4px!important;
  }

  .input-icon span{
    width:48px!important;
    font-size:17px!important;
  }

  .input-icon input,
  .form-grid select{
    min-height:50px!important;
    padding:12px 14px!important;
    font-size:14px!important;
    border-radius:12px!important;
  }

  .input-icon{
    border-radius:12px!important;
  }

  .address-warning{
    font-size:15px!important;
    line-height:1.18!important;
    padding:13px 10px!important;
  }

  .checkout-totals div{
    font-size:15px!important;
  }

  .checkout-totals .total-line{
    font-size:22px!important;
  }

  .checkout-totals .cod-fee-note,
  .cod-fee-note{
    font-size:11px!important;
  }

  .pay-btn{
    font-size:17px!important;
    padding:16px 12px!important;
    border-radius:14px!important;
    line-height:1.15!important;
  }

  .pay-note{
    font-size:12px!important;
  }

  .secure-shipping{
    margin:18px 0 8px!important;
  }

  .secure-shipping strong{
    font-size:20px!important;
    letter-spacing:9px!important;
  }
}

@media(max-width:420px){
  .checkout-dialog{
    padding:16px 12px!important;
  }

  .input-icon input,
  .form-grid select{
    font-size:13px!important;
  }

  .secure-shipping strong{
    font-size:18px!important;
    letter-spacing:7px!important;
  }
}

/* ============================================================
   AJUSTE - Checkout limpio sin mensaje superior ni texto montado
   ============================================================ */

.checkout-trust-note{
  display:none!important;
}

.pay-note{
  display:none!important;
}

.pay-btn{
  margin-top:14px!important;
  margin-bottom:0!important;
  line-height:1.15!important;
}

@media(max-width:720px){
  .pay-btn{
    font-size:16px!important;
    padding:16px 12px!important;
  }
}

/* ============================================================
   LUMARA - Quitar sello SIC/Envia y botón final más landing page
   ============================================================ */

.trust-logos,
.sic,
.sic-badge,
.security-badge,
.checkout-seal,
.sic-seal{
  display:none!important;
}

/* Por si el sello queda como texto dentro de un contenedor */
.checkout-dialog .trust-logos{
  display:none!important;
}

.pay-note{
  display:none!important;
}

/* Botón final: llamativo, seguro y premium */
.pay-btn{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  width:100%!important;
  min-height:78px!important;
  margin:22px 0 0!important;
  padding:18px 22px!important;
  border:0!important;
  border-radius:24px!important;
  background:
    radial-gradient(circle at 20% 15%, rgba(190,239,73,.42), transparent 34%),
    linear-gradient(135deg,#8ba451 0%,#63813f 42%,#405d2a 100%)!important;
  color:#fff!important;
  box-shadow:
    0 22px 48px rgba(64,93,42,.38),
    0 0 0 1px rgba(255,255,255,.28) inset,
    0 0 0 6px rgba(139,164,81,.10)!important;
  cursor:pointer!important;
  text-align:center!important;
  text-transform:none!important;
  letter-spacing:-.025em!important;
  transform:translateZ(0);
  transition:transform .18s ease, filter .18s ease, box-shadow .18s ease!important;
  animation:lumaraSecurePulse 2.4s ease-in-out infinite!important;
}

.pay-btn::before{
  content:"";
  position:absolute;
  inset:-40% -70%;
  z-index:-1;
  background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.34) 48%,transparent 62%);
  transform:translateX(-45%) rotate(8deg);
  animation:lumaraSecureShine 3.2s ease-in-out infinite;
}

.pay-btn::after{
  content:"Compra segura";
  position:absolute;
  top:10px;
  right:14px;
  z-index:1;
  padding:5px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.16);
  color:rgba(255,255,255,.94);
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.02em;
}

.pay-btn-main{
  position:relative;
  z-index:2;
  display:block;
  color:#fff!important;
  font-size:clamp(19px,2.3vw,28px)!important;
  line-height:1.05!important;
  font-weight:950!important;
  letter-spacing:-.04em!important;
}

.pay-btn-sub{
  position:relative;
  z-index:2;
  display:block;
  margin-top:7px;
  color:rgba(255,255,255,.92)!important;
  font-size:clamp(12px,1.4vw,15px)!important;
  line-height:1.1!important;
  font-weight:800!important;
  letter-spacing:-.01em!important;
}

.pay-btn:hover{
  transform:translateY(-2px)!important;
  filter:brightness(1.05)!important;
  box-shadow:
    0 26px 56px rgba(64,93,42,.44),
    0 0 0 1px rgba(255,255,255,.30) inset,
    0 0 0 8px rgba(139,164,81,.12)!important;
}

.pay-btn:active{
  transform:scale(.99)!important;
}

@keyframes lumaraSecurePulse{
  0%,100%{
    box-shadow:
      0 22px 48px rgba(64,93,42,.34),
      0 0 0 1px rgba(255,255,255,.28) inset,
      0 0 0 6px rgba(139,164,81,.10);
  }
  50%{
    box-shadow:
      0 26px 58px rgba(64,93,42,.44),
      0 0 0 1px rgba(255,255,255,.32) inset,
      0 0 0 10px rgba(139,164,81,.14);
  }
}

@keyframes lumaraSecureShine{
  0%{transform:translateX(-55%) rotate(8deg);}
  42%,100%{transform:translateX(55%) rotate(8deg);}
}

@media(max-width:720px){
  .pay-btn{
    min-height:74px!important;
    padding:17px 12px!important;
    border-radius:20px!important;
    margin-top:18px!important;
  }

  .pay-btn::after{
    top:8px;
    right:10px;
    font-size:9.5px;
    padding:4px 8px;
  }

  .pay-btn-main{
    font-size:17px!important;
    padding:0 48px 0 0;
  }

  .pay-btn-sub{
    font-size:11px!important;
    margin-top:6px;
  }
}

@media(max-width:390px){
  .pay-btn-main{
    font-size:15.5px!important;
    padding-right:42px;
  }

  .pay-btn-sub{
    font-size:10.5px!important;
  }
}

@media (prefers-reduced-motion: reduce){
  .pay-btn,
  .pay-btn::before{
    animation:none!important;
  }
}