/* =====================================================
   ESTUFAS CONTINENTAL — Landing Mes de la Madre
   lp-madres.css — v4 — todos los fixes aplicados
   ===================================================== */

/* Fuentes cargadas via wp_enqueue_style en functions.php — no @import aquí */

:root{
  --teal:#055E6F;--teal-deep:#04434F;--teal-ink:#022b33;
  --ice:#84DBF3;--ice-soft:#D6F1F9;
  --cream:#faf8f5;--cream-2:#F2EBE0;
  --ink:#0E1A1D;--ink-2:#3A4A4E;
  --line:rgba(5,94,111,0.14);
  --coral:#E26A4A;--amber:#C77B2D;
  --r-md:18px;--r-lg:28px;--r-xl:50px;
  --maxw:1320px;
  --font-sans:"DM Sans",system-ui,sans-serif;
  --font-serif:"Fraunces",Georgia,serif;
  --font-mono:"JetBrains Mono",monospace;
}

/* === ROOT === */
#lp{
  font-family:var(--font-sans) !important;
  color:var(--ink) !important;background:var(--cream) !important;
  font-size:17px !important;line-height:1.55 !important;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;position:relative;
  padding-top:136px !important;
  /* sin transition en padding — evita que el contenido salte */
}
#lp *,#lp *::before,#lp *::after{box-sizing:border-box !important}
#lp img,#lp video,#lp iframe{max-width:100% !important}
#lp a{color:inherit !important;text-decoration:none !important}
#lp button{cursor:pointer;border:none;background:none;color:inherit}
#lp .container{max-width:var(--maxw);margin:0 auto;padding:0 32px}

/* ambient overlay */
#lp::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:5;
  background:radial-gradient(70% 55% at 95% 2%,rgba(5,94,111,.08),transparent 55%),
             radial-gradient(55% 45% at 0% 28%,rgba(132,219,243,.07),transparent 60%);
}
#lp>*{position:relative;z-index:1}

/* ══════════════════════════════════════════════════════
   TIPOGRAFÍAS — MÁXIMA ESPECIFICIDAD + !important
   Riode usa body font-family con !important, necesitamos
   un selector más específico para ganarle.
   ══════════════════════════════════════════════════════ */
html body #lp,
html body #lp div,
html body #lp section,
html body #lp nav,
html body #lp footer,
html body #lp article,
html body #lp p,
html body #lp span,
html body #lp a,
html body #lp li,
html body #lp button,
html body #lp input,
html body #lp label{
  font-family:var(--font-sans) !important;
}
html body #lp h1,
html body #lp h2,
html body #lp h3,
html body #lp h4,
html body #lp h5,
html body #lp h6{
  font-family:var(--font-sans) !important;
}

/* ── SERIF — clases específicas ── */
html body #lp .display,
html body #lp .sec-title,
html body #lp .sp-rating strong,
html body #lp .htstep-num,
html body #lp .htstep h3,
html body #lp .testi-quote,
html body #lp .certs-title,
html body #lp .faq-contact h4,
html body #lp .faq-contact-mobile h4,
html body #lp .faq-q,
html body #lp .cdblock strong,
html body #lp .nav-mobile-link,
html body #lp .popup h3,
html body #lp .cta-final h2{
  font-family:var(--font-serif) !important;
  font-weight:400 !important;
  font-synthesis:none !important;
}
html body #lp .display,
html body #lp .sec-title{   
  font-weight:400 !important;
  font-variation-settings:"opsz" 144 !important;
  letter-spacing:-.02em !important;
  line-height:1.0 !important;
}
/* ── MONO ── */
html body #lp .urgency-cd,
html body #lp .popup-code,
html body #lp .popup-code strong{
  font-family:var(--font-mono) !important;
}

/* === URGENCY BAR === */
#lp .urgency{
  position:fixed;top:0;left:0;right:0;z-index:60;
  background:var(--teal-ink);color:#fff !important;
  display:flex;justify-content:center;align-items:center;
  gap:18px;padding:10px 20px;font-size:13px;letter-spacing:.02em;
  border-bottom:1px solid rgba(255,255,255,.08);flex-wrap:wrap;
  height:38px;min-height:38px;
}
#lp .urgency-pulse{
  width:7px;height:7px;border-radius:50%;background:var(--ice);
  box-shadow:0 0 0 0 rgba(132,219,243,.7);animation:lp-pulse 2s infinite;flex-shrink:0;
}
@keyframes lp-pulse{
  70%{box-shadow:0 0 0 8px rgba(132,219,243,0)}
  100%{box-shadow:0 0 0 0 rgba(132,219,243,0)}
}
#lp .urgency strong{color:var(--ice) !important;font-weight:600 !important;}
#lp .urgency-cd{
  background:rgba(255,255,255,.1);padding:3px 8px;border-radius:5px;
  font-size:12px !important;letter-spacing:.04em;display:inline;margin-left:4px;
}

/* === TOP TICKER === */
#lp .top-ticker{
  background:var(--teal-ink);color:rgba(255,255,255,.9) !important;
  height:38px;overflow:hidden;position:fixed;top:38px;left:0;right:0;z-index:59;white-space:nowrap;
}
#lp .top-ticker-inner{
  display:inline-flex;align-items:center;width:max-content;min-width:max-content;
  animation:lp-tickerScroll 32s linear infinite;will-change:transform;
}
@keyframes lp-tickerScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
#lp .tt-item{
  display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500;
  padding:0 28px;white-space:nowrap;height:38px;
}
#lp .tt-item svg{width:14px;height:14px;opacity:.8;flex-shrink:0}
#lp .tt-sep{opacity:.35;font-size:16px;line-height:1;padding:0 4px}

/* === NAV === */
#lp .site-nav{
  background:#fff;border-bottom:1px solid var(--line);
  position:fixed;top:76px;left:0;right:0;z-index:58;
  box-shadow:0 2px 8px rgba(2,43,51,.06);
}
#lp .nav-inner{
  width:100%;max-width:1600px;margin:0 auto;padding:0 32px;
  display:flex;align-items:center;justify-content:space-between;height:60px;
}
#lp .nav-logo img{
  height:34px !important;width:auto !important;max-width:180px !important;
  object-fit:contain !important;display:block !important;
}
#lp .nav-links{display:flex;align-items:center}
#lp .nav-link{
  padding:8px 18px;font-size:14px !important;font-weight:500 !important;
  color:var(--ink-2) !important;transition:color .2s;white-space:nowrap;
  border-bottom:2px solid transparent;
}
#lp .nav-link:hover{color:var(--teal-ink) !important}
#lp .nav-link.active{color:var(--teal-ink) !important;border-bottom-color:var(--teal) !important}
#lp .nav-hamburger{display:none;background:none;border:none;cursor:pointer;padding:8px;color:var(--teal-ink)}
#lp .nav-hamburger svg{width:24px;height:24px}
#lp .nav-mobile-overlay{
  visibility:hidden;pointer-events:none;position:fixed;inset:0;z-index:200;
  background:rgba(2,43,51,.92);backdrop-filter:blur(20px);
  flex-direction:column;align-items:center;justify-content:center;
  opacity:0;transition:opacity .3s ease;
}
#lp .nav-mobile-overlay.is-open{
  visibility:visible !important;pointer-events:auto !important;
  display:flex !important;opacity:1 !important;
}
#lp .nav-mobile-link{
  color:#fff !important;font-size:22px !important;font-weight:500 !important;
  padding:18px 40px !important;text-align:center !important;width:100% !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
}
#lp .nav-mobile-link:first-child{border-top:1px solid rgba(255,255,255,.08) !important}
#lp .nav-mobile-close{
  position:absolute;top:20px;right:20px;background:none;border:none;
  color:rgba(255,255,255,.7);cursor:pointer;padding:8px;
}
#lp .nav-mobile-close svg{width:28px;height:28px}

/* ══════════════════════════════════════════════════════
   HERO SLIDER
   El stage toma la altura de la imagen activa.
   Los slides inactivos son opacity:0 pero position:static
   para que no colapsen el contenedor.
   ══════════════════════════════════════════════════════ */
#lp .hero{padding:32px 32px 0 !important;background:#fff}
#lp .hero-stage{
  position:relative !important;
  border-radius:var(--r-xl);
  overflow:hidden !important;
  background:#0a1518;
  max-width:1600px;margin:0 auto;
  width:100%;
}
#lp .hero-slides{
  position:relative;
  width:100%;
  /* min-height evita el colapso mientras la imagen carga */
  min-height:200px;
}
/* Todos los slides absolutos sobre el contenedor */
#lp .hero-slide{
  position:absolute !important;
  top:0;left:0;
  width:100% !important;
  opacity:0;
  visibility:hidden;
  transition:opacity .85s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}
/* El activo en flujo para dar altura real al contenedor */
#lp .hero-slide.is-active{
  position:relative !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto;
}
#lp .hero-slide a{
  display:block !important;
  width:100% !important;
  line-height:0; /* elimina espacio fantasma debajo del img */
}
#lp .hero-slide img{
  width:100% !important;
  height:auto !important;
  display:block !important;
  max-width:100% !important;
  object-fit:unset !important;
  vertical-align:bottom; /* elimina espacio inline debajo */
}
#lp .hero-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:52px;height:52px;border-radius:50%;
  background:rgba(255,255,255,.95);backdrop-filter:blur(10px);
  color:var(--teal-ink);display:grid;place-items:center;
  transition:background .25s,color .25s,transform .25s;
  z-index:3;box-shadow:0 8px 24px -8px rgba(0,0,0,.3);cursor:pointer;
}
#lp .hero-arrow:hover{background:var(--teal-ink);color:#fff;transform:translateY(-50%) scale(1.06)}
#lp .hero-arrow svg{width:20px;height:20px}
#lp .hero-arrow.prev{left:24px}
#lp .hero-arrow.next{right:24px}

/* === SOCIAL PROOF === */
#lp .sp-strip{background:#fff;padding:36px 0;text-align:center;border-bottom:1px solid var(--line)}
#lp .sp-strip-inner{display:flex;justify-content:center;align-items:center;gap:32px;flex-wrap:wrap}
#lp .sp-rating{display:flex;align-items:center;gap:10px}
#lp .sp-stars{display:flex;gap:2px;color:#E7A93B}
#lp .sp-stars svg{width:18px;height:18px;fill:currentColor}
#lp .sp-rating strong{font-size:22px !important;color:var(--teal-ink) !important}
#lp .sp-text{font-size:15px;color:var(--ink-2)}
#lp .sp-text strong{color:var(--teal-ink) !important;font-weight:600 !important}
#lp .sp-divider{width:1px;height:24px;background:var(--line)}

/* === SECTIONS === */
#lp section{position:relative}
#lp .sec{padding:80px 0;background:var(--cream);overflow:hidden}
#lp .sec-white{background:#fff}
#lp .sec-divider{height:1px;background:linear-gradient(90deg,transparent,#f0ece6 30%,#f0ece6 70%,transparent)}
#lp .sec-head{margin-bottom:64px}
#lp .sec-eyebrow{
  display:flex;align-items:center;gap:10px;color:var(--teal) !important;
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;margin-bottom:18px;
}
#lp .sec-eyebrow::before{content:"";width:32px;height:1px;background:var(--teal)}
#lp .sec-title{
  font-size:clamp(36px,5vw,64px) !important;margin:0 0 24px;
  text-wrap:balance;line-height:1.0 !important;
}
#lp .sec-title em{font-style:italic;color:var(--teal) !important;font-weight:400}
#lp .sec-intro{color:var(--ink-2) !important;font-size:18px;margin:0;line-height:1.55}

/* === BUTTONS === */
#lp .btn,#lp .popup-cta-btn{
  display:inline-flex !important;align-items:center !important;justify-content:center !important;
  gap:10px !important;padding:16px 26px !important;border-radius:999px !important;border:none !important;
  font-weight:500 !important;font-size:15px !important;
  transition:transform .2s,box-shadow .3s,background .25s !important;text-decoration:none !important;
}
#lp .btn svg{width:16px;height:16px;transition:transform .25s;flex-shrink:0}
#lp .btn:hover svg{transform:translateX(3px)}
#lp .btn-primary{background:var(--teal-ink) !important;color:#fff !important;box-shadow:0 8px 22px rgba(0,0,0,.10) !important}
#lp .btn-primary:hover{background:var(--teal-deep) !important;transform:translateY(-2px) !important}
#lp .btn-primary *{color:#fff !important}
#lp .btn-ice{
  background:linear-gradient(135deg,var(--ice) 0%,#5fc8e4 100%) !important;
  color:var(--teal-ink) !important;
  box-shadow:0 14px 40px -12px rgba(132,219,243,.5),inset 0 1px 0 rgba(255,255,255,.4) !important;
}
#lp .btn-ice:hover{transform:translateY(-2px) !important;color:var(--teal-ink) !important}
#lp .btn-ice *{color:var(--teal-ink) !important}
#lp .btn-ghost{
  color:#fff !important;border:1px solid rgba(255,255,255,.3) !important;
  background:rgba(255,255,255,.04) !important;backdrop-filter:blur(8px);
}
#lp .btn-ghost:hover{background:rgba(255,255,255,.14) !important;color:#fff !important}

/* === PRODUCTS === */
#lp .prod-grid-wrap{padding:24px 0 8px}
#lp .prod-grid-row{display:grid;gap:28px;margin-bottom:28px}
#lp .prod-grid-row.row-3{grid-template-columns:repeat(3,1fr)}
#lp .prod-grid-row.row-2{grid-template-columns:repeat(2,1fr);max-width:66%;margin-left:auto;margin-right:auto}
#lp .product-card{position:relative;background:transparent;cursor:pointer;transition:transform .3s;display:block;overflow:visible}
#lp .product-card:hover{transform:translateY(-4px)}
#lp .product-card>img{width:100% !important;height:auto !important;display:block !important;border-radius:12px}
#lp .savings-badge{
  position:absolute;top:-13px;left:-13px;z-index:10;
  background:var(--teal-ink) !important;color:#fff !important;
  padding:5px 11px;border-radius:6px;font-size:10px !important;font-weight:700 !important;
  letter-spacing:.06em;box-shadow:0 4px 12px -3px rgba(2,43,51,.35);
  display:inline-flex;align-items:center;
}
#lp .savings-badge::after{
  content:"";position:absolute;left:2px;bottom:-5px;
  width:8px;height:5px;background:var(--teal-ink);
  clip-path:polygon(0 0,100% 0,100% 100%);
}

/* ══════════════════════════════════════════════════════
   MID CAROUSEL — mismo fix que hero
   ══════════════════════════════════════════════════════ */
#lp .midfull{padding:80px 32px;background:var(--cream)}
#lp .mid-stage{
  position:relative !important;
  overflow:hidden !important;
  background:#0a1518;
  max-width:1600px;margin:0 auto;border-radius:var(--r-xl);
  width:100%;
}
#lp .mid-slides{
  position:relative;
  width:100%;
  min-height:200px;
}
#lp .mid-slide{
  position:absolute !important;
  top:0;left:0;
  width:100% !important;
  opacity:0;
  visibility:hidden;
  transition:opacity .6s ease;
  pointer-events:none;
}
#lp .mid-slide.is-active{
  position:relative !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto;
}
#lp .mid-slide a{
  display:block !important;
  width:100% !important;
  line-height:0;
}
#lp .mid-slide img{
  width:100% !important;
  height:auto !important;
  display:block !important;
  max-width:100% !important;
  object-fit:unset !important;
  vertical-align:bottom;
}
#lp .mid-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:48px;height:48px;border-radius:50%;
  background:rgba(0,0,0,.45);backdrop-filter:blur(10px);
  color:#fff;display:grid;place-items:center;transition:background .25s,color .25s;z-index:3;
}
#lp .mid-arrow:hover{background:var(--ice);color:var(--teal-ink)}
#lp .mid-arrow svg{width:18px;height:18px}
#lp .mid-arrow.prev{left:20px}
#lp .mid-arrow.next{right:20px}
#lp .mid-dots{display:flex;justify-content:center;gap:10px;margin-top:24px}
#lp .mid-dot{
  width:10px;height:10px;border-radius:50%;background:var(--line);
  cursor:pointer;transition:background .25s,transform .25s;
}
#lp .mid-dot.is-active{background:var(--teal);transform:scale(1.2)}

/* === COMBOS === */
#lp .combos-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px 32px;padding-top:16px;padding-left:16px}
#lp .combo{
  position:relative;border-radius:24px;background:#fff;cursor:pointer;
  transition:transform .5s ease;box-shadow:0 4px 12px rgba(0,0,0,.06);overflow:visible;
}
#lp .combo:hover{transform:translateY(-4px)}
#lp .combo-img-wrap{overflow:hidden;border-radius:24px}
#lp .combo-img-wrap img{
  width:100% !important;height:auto !important;display:block !important;
  transition:transform 1s cubic-bezier(.2,.8,.2,1);border-radius:24px;
}

/* === HORIZONTAL TIMELINE === */
#lp .htimeline{
  position:relative;display:grid;grid-template-columns:repeat(4,1fr);
  gap:24px;max-width:1100px;margin:0 auto;padding:0 20px;
}
#lp .htimeline-line{
  position:absolute;left:calc(12.5% + 30px);right:calc(12.5% + 30px);top:27px;
  height:2px;background:linear-gradient(90deg,var(--teal) 0%,var(--ice-soft) 100%);z-index:0;
}
#lp .htstep{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;z-index:1}
#lp .htstep-num{
  width:56px;height:56px;border-radius:50%;background:var(--cream);
  border:2px solid var(--teal) !important;color:var(--teal) !important;
  font-weight:600;font-size:22px;display:grid;place-items:center;
  box-shadow:0 0 0 4px var(--cream),0 3px 10px -6px rgba(5,94,111,.1);
  transition:transform .35s,background .35s,color .35s;
}
#lp .sec-white .htstep-num{background:#fff;box-shadow:0 0 0 4px #fff,0 3px 10px -6px rgba(5,94,111,.06)}
#lp .htstep:hover .htstep-num{background:var(--teal) !important;color:#fff !important;transform:scale(1.06)}
#lp .htstep h3{font-size:21px;font-weight:600;color:var(--teal-ink) !important;margin:0;line-height:1.15}
#lp .htstep p{color:var(--ink-2);font-size:15px;margin:0;line-height:1.5;max-width:24ch}

/* === TESTIMONIALS === */
#lp .testi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
#lp .testi{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-md);
  padding:28px 24px;display:flex;flex-direction:column;gap:10px;
  transition:transform .35s,box-shadow .35s,border-color .35s;
}
#lp .testi:hover{transform:translateY(-4px);box-shadow:0 8px 18px rgba(0,0,0,.08);border-color:transparent}
#lp .testi-stars{display:flex;gap:2px;color:#E7A93B}
#lp .testi-stars svg{width:16px;height:16px;fill:currentColor}
#lp .testi-quote{font-size:19px !important;line-height:1.3;color:var(--teal-ink) !important;margin:0;flex:1}
#lp .testi-foot{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:18px;border-top:1px solid var(--line)}
#lp .testi-avatar{
  width:42px;height:42px;border-radius:50%;
  background:linear-gradient(135deg,var(--ice-soft),var(--ice));
  color:var(--teal-ink);display:grid;place-items:center;font-weight:600;
  flex-shrink:0;
}
#lp .testi-meta{display:flex;flex-direction:column;line-height:1.2}
#lp .testi-meta strong{font-size:14px;color:var(--ink) !important}
#lp .testi-meta span{font-size:12px;color:var(--ink-2)}

/* === CERTS === */
#lp .certs-wrap{text-align:center;padding:80px 0}
#lp .certs-eyebrow{color:var(--teal) !important;font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;margin-bottom:18px}
#lp .certs-title{font-size:32px !important;color:var(--teal-ink) !important;font-weight:500;margin:0 0 56px;line-height:1.15}
#lp .certs{display:flex;justify-content:center;align-items:center;gap:40px;flex-wrap:nowrap}
#lp .certs img{
  height:180px !important;width:auto !important;max-width:300px !important;
  object-fit:contain !important;flex-shrink:0;
  transition:transform .25s;display:block !important;
}
#lp .certs img:hover{transform:scale(1.04)}

/* === FAQ === */
#lp .faq-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:80px;align-items:flex-start}
#lp .faq-side .sec-eyebrow{justify-content:flex-start}
#lp .faq-side h2{margin:0 0 20px;text-align:left}
#lp .faq-side p{color:var(--ink-2);font-size:17px;line-height:1.6;margin:0 0 16px;text-align:left}
#lp .faq-contact{text-align:left;border-top:1px solid var(--line);padding-top:32px}
#lp .faq-contact h4{font-size:24px !important;margin:0 0 16px;color:var(--teal-ink) !important;line-height:1.1}
#lp .faq-contact-list{display:flex;flex-direction:column;gap:12px}
#lp .faq-contact-item{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--ink-2)}
#lp .faq-contact-item svg{width:18px;height:18px;color:var(--teal);flex-shrink:0}
#lp .faq-list{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line)}
#lp .faq-item{border-bottom:1px solid var(--line)}
#lp .faq-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;gap:24px;
  padding:26px 0;text-align:left;font-size:21px !important;font-weight:500;
  color:var(--teal-ink) !important;line-height:1.15;transition:color .2s;
}
#lp .faq-q:hover{color:var(--teal) !important}
#lp .faq-icon{
  width:36px;height:36px;border-radius:50%;border:1px solid var(--line);
  display:grid;place-items:center;color:var(--teal) !important;flex-shrink:0;
  transition:transform .35s,background .25s,color .25s;
}
#lp .faq-icon svg{width:14px;height:14px;transition:transform .35s}
#lp .faq-item.is-open .faq-icon{background:var(--teal) !important;color:#fff !important;border-color:var(--teal) !important}
#lp .faq-item.is-open .faq-icon svg{transform:rotate(45deg)}
#lp .faq-a{max-height:0;overflow:hidden;transition:max-height .45s cubic-bezier(.2,.8,.2,1)}
#lp .faq-a-inner{padding:0 0 28px;color:var(--ink-2);font-size:16px;line-height:1.6;max-width:65ch}
#lp .faq-item.is-open .faq-a{max-height:600px}

/* === VIDEO SECTION === */
#lp .video-sec{padding:80px 0 160px;background:var(--cream);position:relative}
#lp .video-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;max-width:var(--maxw);margin:0 auto;padding:0 32px 80px}
#lp .video-text h2{margin:0 0 24px}
#lp .video-text p{color:var(--ink-2);font-size:18px;line-height:1.6;margin:0 0 32px}
/* col derecha: el video se empuja a la derecha, dejando espacio para la img flotante a la izq */
#lp .video-col{display:flex;justify-content:flex-end;padding-left:120px}
#lp .video-stage{
  position:relative;
  aspect-ratio:9/16;max-width:340px;width:100%;
  border-radius:24px;
  overflow:visible !important;
}
#lp .video-stage>video{
  width:100%;height:100%;object-fit:cover;display:block;border-radius:24px;
  position:relative;z-index:2;
}
#lp .video-thumb{
  position:absolute;
  left:-78%;bottom:20px;
  width:78%;aspect-ratio:4/5;
  border-radius:18px;overflow:hidden;
  border:4px solid #fff;
  box-shadow:0 16px 36px -8px rgba(0,0,0,.35);
  z-index:3;
  background:var(--cream);
  display:block !important;
}
#lp .video-thumb img{
  width:100% !important;height:100% !important;
  object-fit:cover !important;object-position:center top !important;
  display:block !important;
}

/* ══════════════════════════════════════════════════════
   POPUP — FIX IMAGEN
   El problema era visibility:hidden inicial que Riode
   o Elementor convertía en display:none antes de que
   la imagen cargara. Usamos opacity+pointer-events.
   ══════════════════════════════════════════════════════ */
#lp .popup-overlay{
  position:fixed !important;inset:0 !important;
  background:rgba(2,43,51,.6);backdrop-filter:blur(8px);
  z-index:9999 !important;
  /* NUNCA display:none — usamos opacity para ocultar */
  display:flex !important;
  align-items:center;justify-content:center;padding:20px;
  opacity:0;pointer-events:none;
  transition:opacity .3s ease;
}
#lp .popup-overlay.is-open{
  opacity:1 !important;
  pointer-events:auto !important;
}
#lp .popup{
  background:#fff !important;border-radius:24px;
  width:100%;max-width:680px;
  display:grid !important;grid-template-columns:1fr 1fr;
  overflow:hidden;
  box-shadow:0 40px 80px -20px rgba(0,0,0,.4);
  transform:scale(.94) translateY(12px);
  transition:transform .4s cubic-bezier(.2,.8,.2,1),opacity .35s ease;
  min-height:380px;
  opacity:0;
}
#lp .popup-overlay.is-open .popup{
  transform:scale(1) translateY(0) !important;
  opacity:1 !important;
}
/* La imagen del popup — carga aunque esté oculto el overlay */
#lp .popup-img{
  position:relative;background:var(--teal-ink);
  min-height:100%;overflow:hidden;
}
#lp .popup-img img{
  position:absolute !important;inset:0 !important;
  width:100% !important;height:100% !important;
  object-fit:cover !important;object-position:center top !important;
  display:block !important;
}
#lp .popup-content{
  padding:36px 28px;display:flex;flex-direction:column;
  justify-content:center;position:relative;
}
#lp .popup-close{
  position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;
  background:var(--cream);color:var(--ink-2);display:grid;place-items:center;
  cursor:pointer;border:none;transition:background .2s;
}
#lp .popup-close:hover{background:var(--line)}
#lp .popup-close svg{width:14px;height:14px}
#lp .popup-eyebrow{color:var(--teal) !important;font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;margin-bottom:14px}
#lp .popup h3{font-size:26px !important;font-weight:500 !important;line-height:1.15 !important;color:var(--teal-ink) !important;margin:0 0 12px}
#lp .popup p{color:var(--ink-2);font-size:14px;margin:0 0 20px;line-height:1.5}
#lp .popup-code{
  background:var(--cream) !important;border:1px dashed var(--teal) !important;
  padding:10px 14px;border-radius:10px;font-size:14px !important;
  color:var(--teal-ink) !important;text-align:center;margin-bottom:16px;letter-spacing:.1em;
}
#lp .popup-code strong{color:var(--teal) !important}

/* === CTA FINAL === */
#lp .cta-final{
  position:relative;margin:0 32px 80px;border-radius:var(--r-xl);overflow:hidden;
  color:#fff !important;background:linear-gradient(135deg,#022b33 0%,#055E6F 100%);min-height:560px;
}
#lp .cta-final-img{position:absolute;inset:0;width:100% !important;height:100% !important;object-fit:cover;object-position:center top;opacity:.5;display:block !important}
#lp .cta-final::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(120deg,rgba(2,43,51,.82) 0%,rgba(2,43,51,.6) 50%,rgba(5,94,111,.4) 100%);
}
#lp .cta-final-content{
  position:relative;z-index:2;padding:100px 80px;
  display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:center;
}
#lp .cta-final h2{font-size:clamp(40px,5.2vw,72px) !important;margin:0 0 20px;color:#fff !important;line-height:1.0 !important}
#lp .cta-final h2 em{font-style:italic;color:var(--ice) !important;font-weight:400}
#lp .cta-final .sec-eyebrow{color:#fff !important}
#lp .cta-final .sec-eyebrow::before{background:#fff !important}
#lp .cta-final p{font-size:18px;color:rgba(255,255,255,.78) !important;margin:0 0 36px;line-height:1.5}
#lp .cta-final-btns{display:flex;gap:14px;flex-wrap:wrap}
#lp .cta-bullets{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:20px}
#lp .cta-bullet{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.85) !important}
#lp .cta-bullet svg{width:16px;height:16px;color:var(--ice) !important;flex-shrink:0}

/* === COUNTDOWN === */
#lp .lp-timer{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
#lp .cdblock{
  background:rgba(255,255,255,.06) !important;backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.14) !important;border-radius:18px;padding:26px 14px;text-align:center;
}
#lp .cdblock strong{font-size:54px !important;font-weight:500 !important;display:block;line-height:1;color:#fff !important}
#lp .cdblock span{font-size:10px !important;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.65) !important;margin-top:8px;display:block}

/* === PAYMENT BANNER === */
#lp .payment-banner{padding:36px 32px;background:#fff;text-align:center;border-top:1px solid var(--line);border-bottom:1px solid rgba(5,94,111,.1)}
#lp .payment-banner img{max-width:900px !important;margin:0 auto;height:auto !important}

/* === FOOTER === */
#lp .site-footer{background:var(--teal-ink) !important;color:rgba(255,255,255,.85) !important;padding:56px 48px 32px;width:100%}
#lp .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px 56px;margin-bottom:40px}
#lp .footer-logo img{height:56px !important;width:auto !important;max-width:280px !important;object-fit:contain !important;margin-bottom:20px;filter:brightness(0) invert(1);display:block !important}
#lp .footer-tagline{font-size:14px;opacity:.7;line-height:1.6}
#lp .footer-col h4{font-size:13px !important;font-weight:700 !important;letter-spacing:.08em;text-transform:uppercase;color:var(--ice) !important;margin:0 0 16px}
#lp .footer-col p,#lp .footer-col a{font-size:13px !important;opacity:.8;line-height:1.45;display:block;margin-bottom:3px;color:rgba(255,255,255,.85) !important}
#lp .footer-col a:hover{opacity:1;color:var(--ice) !important}
#lp .footer-bottom{padding-top:20px;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:12px;opacity:.5}

/* === REVEAL === */
#lp .reveal{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1)}
#lp .reveal.is-in{opacity:1 !important;transform:none !important}

/* === SUPPRESS WP PLUGIN WA BTN === */
.wa__btn_popup,.wa__btn_popup_txt,.wa__popup_chat_box,#wa__btn_popup{
  display:none !important;opacity:0 !important;visibility:hidden !important;pointer-events:none !important;
}
body{padding-top:0 !important;overflow-x:clip !important}
html{overflow-x:hidden !important}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media(max-width:1000px){
  #lp .testi-grid{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:900px){
  /* video — columna única, video alineado izquierda */
  #lp .video-grid{grid-template-columns:1fr;gap:48px;padding:0 20px}
  #lp .video-col{padding-left:0;justify-content:flex-start}
  #lp .video-stage{max-width:280px}
  #lp .video-sec{padding:80px 0}
  #lp .video-thumb{display:none !important}
  /* faq */
  #lp .faq-grid{grid-template-columns:1fr;gap:48px}
  /* certs */
  #lp .certs img{height:140px !important;max-width:220px !important}
  /* cta */
  #lp .cta-final{margin:0 16px 60px}
  #lp .cta-final-content{
    grid-template-columns:1fr !important;padding:60px 32px;gap:40px;
    text-align:center !important;
  }
  #lp .cta-final .sec-eyebrow{justify-content:center !important}
  #lp .cta-final h2{text-align:center !important}
  #lp .cta-final-btns{justify-content:center !important}
  #lp .cta-bullets{justify-content:center !important}
  #lp .cta-bullet{justify-content:center !important}
  /* countdown */
  #lp .cdblock strong{font-size:40px !important}
  #lp .cdblock{padding:18px 10px}
  /* footer */
  #lp .footer-grid{grid-template-columns:1fr 1fr;gap:32px}
  /* combos */
  #lp .combos-grid{grid-template-columns:1fr}
  /* timeline */
  #lp .htimeline{grid-template-columns:1fr;gap:32px;max-width:420px}
  #lp .htimeline-line{display:none}
  #lp .htstep{flex-direction:row;text-align:left;align-items:flex-start;gap:18px}
  #lp .htstep-num{flex-shrink:0;width:48px;height:48px;font-size:18px !important}
  #lp .htstep p{max-width:none}
  /* mid */
  #lp .midfull{padding:48px 16px}
  #lp .mid-dots{display:none}
  /* popup */
  #lp .popup{max-width:460px}
}

@media(max-width:720px){
  #lp .nav-links{display:none !important}
  #lp .nav-hamburger{display:flex !important}
  #lp .sp-divider{display:none}
}

@media(max-width:600px){
  #lp .testi-grid{grid-template-columns:1fr}
  /* footer columna única */
  #lp .footer-grid{
    grid-template-columns:1fr !important;gap:28px !important;
    text-align:center !important;
  }
  #lp .footer-logo{display:flex !important;justify-content:center !important}
  #lp .footer-logo img{margin-left:auto !important;margin-right:auto !important}
  #lp .footer-col p,#lp .footer-col a{text-align:center !important}
  /* popup */
  #lp .popup{grid-template-columns:1fr;max-width:340px}
  #lp .popup-img{min-height:180px;max-height:200px}
  #lp .popup-img img{object-position:center top !important}
  /* certs */
  #lp .certs{flex-wrap:wrap;gap:20px}
  #lp .certs img{height:120px !important;max-width:180px !important}
  /* payment banner sin desborde */
  #lp .payment-banner{padding:16px !important;overflow:hidden}
  #lp .payment-banner img{width:100% !important;max-width:100% !important;height:auto !important}
}

@media(max-width:480px){
  /* ── Layout base ── */
  #lp{padding-top:114px !important;overflow-x:clip}

  /* ── Urgency ── */
  #lp .urgency{
    height:30px !important;min-height:30px !important;
    padding:0 8px !important;gap:4px !important;
    overflow:hidden !important;flex-wrap:nowrap !important;
  }
  #lp .urgency>span{font-size:12px !important;white-space:nowrap !important;line-height:1 !important}
  #lp .urgency strong{font-size:12px !important}
  #lp .urgency-cd{font-size:11px !important}

  /* ── Ticker ── */
  #lp .top-ticker{top:30px !important;height:28px !important}
  #lp .top-ticker-inner{height:100% !important;animation:lp-tickerScroll 28s linear infinite !important}
  #lp .tt-item{font-size:12px !important;gap:5px !important;padding:0 14px !important;height:28px !important}
  #lp .tt-item svg{width:12px !important;height:12px !important}

  /* ── Nav ── */
  #lp .site-nav{top:58px !important}
  #lp .nav-inner{height:56px !important;padding:0 14px !important}
  #lp .nav-logo img{height:24px !important;max-width:140px !important}

  /* ── Hero banner — sin bordes, imagen ocupa todo el ancho ── */
  #lp .hero{padding:0 !important;overflow:hidden !important}
  #lp .hero-stage{border-radius:0 !important;max-width:100% !important;width:100% !important}
  #lp .hero-slide img,
  #lp .hero-slide picture,
  #lp .hero-slide a{width:100% !important;display:block !important}
  #lp .hero-slide img{height:auto !important;object-fit:unset !important}
  #lp .hero-arrow{display:none !important}

  /* ── Secciones ── */
  #lp .sec{padding:48px 0}
  #lp .sec-head{margin-bottom:32px}

  /* ── Productos ── */
  #lp .prod-grid-wrap{padding:0 16px !important}
  #lp .prod-grid-row.row-3,
  #lp .prod-grid-row.row-2{
    grid-template-columns:1fr !important;max-width:100% !important;
    margin:0 !important;gap:32px !important;
  }
  #lp .prod-grid-row.row-3{margin-bottom:32px !important}

  /* ── Mid carousel — sin bordes, imagen ocupa todo el ancho ── */
  #lp .midfull{padding:0 !important}
  #lp .mid-stage{border-radius:0 !important;max-width:100% !important;width:100% !important}
  #lp .mid-slide img,
  #lp .mid-slide picture,
  #lp .mid-slide a{width:100% !important;display:block !important}
  #lp .mid-slide img{height:auto !important;object-fit:unset !important}
  #lp .mid-arrow{display:none !important}

  /* ── Payment banner ── */
  #lp .payment-banner{padding:16px !important;overflow:hidden !important}
  #lp .payment-banner img{
    width:100% !important;max-width:100% !important;
    height:auto !important;display:block !important;
  }

  /* ── Video ── */
  #lp .video-sec{padding:48px 0}
  #lp .video-grid{
    grid-template-columns:1fr !important;gap:32px !important;
    padding:0 20px 40px !important;
  }
  #lp .video-col{justify-content:flex-start !important;padding-left:0 !important}
  #lp .video-stage{
    max-width:100% !important;width:100% !important;
    margin:0 !important;overflow:hidden !important;
    aspect-ratio:9/16 !important;
  }
  #lp .video-thumb{display:none !important}

  /* ── Timeline — vertical centrado ── */
  #lp .htimeline{
    grid-template-columns:1fr !important;gap:0 !important;
    max-width:340px !important;margin:0 auto !important;padding:0 16px !important;
  }
  #lp .htstep{flex-direction:column !important;align-items:center !important;text-align:center !important}
  #lp .htstep:not(:last-child){padding-bottom:32px !important}
  #lp .htstep:not(:last-child)::after{
    content:"" !important;display:block !important;
    width:2px !important;height:28px !important;
    background:linear-gradient(180deg,var(--teal),var(--ice-soft)) !important;
    margin:12px auto 0 !important;
  }

  /* ── Social proof ── */
  #lp .sp-strip{padding:18px 0}
  #lp .sp-strip-inner{flex-direction:column !important;gap:4px !important}

  /* ── FAQ ── */
  #lp .faq-contact{display:none !important}
  #lp .faq-contact-mobile{display:block !important}
  #lp .faq-grid{gap:24px !important}

  /* ── CTA Final — todo centrado ── */
  #lp .cta-final{overflow:hidden !important;margin:0 0 40px !important;border-radius:0 !important}
  #lp .cta-final-img{object-position:center center !important}
  #lp .cta-final-content{
    text-align:center !important;grid-template-columns:1fr !important;
    padding:48px 20px !important;
  }
  #lp .cta-final .sec-eyebrow{justify-content:center !important}
  #lp .cta-final h2{text-align:center !important;font-size:clamp(32px,8vw,48px) !important}
  #lp .cta-final-btns{
    flex-direction:row !important;justify-content:center !important;
    flex-wrap:wrap !important;gap:10px !important;
  }
  #lp .cta-final-btns .btn{padding:14px 18px !important;font-size:13px !important}
  #lp .cta-bullets{flex-direction:column !important;align-items:center !important}
  #lp .cta-bullet{justify-content:center !important}

  /* ── Footer — todo centrado ── */
  #lp .site-footer{padding:40px 20px 32px !important}
  #lp .footer-grid{
    grid-template-columns:1fr !important;gap:28px !important;
    text-align:center !important;
  }
  #lp .footer-logo{display:flex !important;justify-content:center !important}
  #lp .footer-logo img{margin-left:auto !important;margin-right:auto !important}
  #lp .footer-col p,#lp .footer-col a{text-align:center !important}
  #lp .footer-bottom{text-align:center !important}

  /* ── Certs ── */
  #lp .certs{flex-wrap:wrap !important;gap:16px !important;justify-content:center !important}
  #lp .certs img{height:100px !important;max-width:160px !important}

  /* ── Popup ── */
  #lp .popup{grid-template-columns:1fr !important;max-width:90vw !important}
  #lp .popup-img{min-height:160px !important;max-height:180px !important}
}

@media(min-width:481px){
  #lp .nav-mobile-overlay{display:none !important}
  #lp .nav-hamburger{display:none !important}
  #lp .faq-contact-mobile{display:none !important}
  #lp .certs img{height:180px !important;max-width:300px !important}
}

#lp .nav-links .nav-link{
  font-size:14px !important;
  color:var(--ink-2) !important;
}
#lp .nav-links{
  visibility:visible !important;
}