@import url('https://fonts.googleapis.com/css2?family=Zilla+Slab:wght@600;700&family=IBM+Plex+Sans:wght@400;500;600&display=swap');

.vg-lp{
  /* ---- BASE ---- */
  --paper:#F4ECDC;        /* manila claro — nunca blanco */
  --paper-alt:#EADFC8;    /* secciones pares */
  --surface:#FBF6EA;      /* la ficha: un escalón más clara */
  --filet:#CDBE9C;        /* borde 1px */
  --riga:#C4D0DE;         /* renglón de ficha */
  --ink:#1B2540;          /* tinta: títulos y bloques a sangre */

  /* ---- LAS 8 PESTAÑAS (orden canónico) ---- */
  --c1:#D9735B; --c2:#D99A2B; --c3:#8FAE5D; --c4:#4F9C8F;
  --c5:#5B8FC4; --c6:#7A6FB8; --c7:#C46A93; --c8:#8A6B4E;

  /* ---- ACENTOS ---- */
  --acento:#22408F;       /* solo lo que se toca */
  --acento-d:#172C66;
  --valor:#FFE14D;        /* resaltador: UNA vez por pieza, nunca texto ni botón */

  /* ---- TEXTO ---- */
  --tx-h:#1B2540;
  --tx:#3A4256;
  --tx-lb:#7A7362;
  --rojo:#B3261E;

  --disp:'Zilla Slab',Georgia,serif;
  --sans:'IBM Plex Sans',system-ui,-apple-system,sans-serif;

  font-family:var(--sans);
  color:var(--tx);
  background:var(--paper);
  line-height:1.65;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.vg-lp *{box-sizing:border-box}
.vg-lp img{max-width:100%;display:block;height:auto}

/* ============ SECCIONES ============ */
.vg-lp .vg-sec{position:relative;padding:64px 0;background:var(--paper)}
.vg-lp .vg-sec--alt{background:var(--paper-alt)}
.vg-lp .vg-sec--oferta{background:var(--ink)}          /* los dos únicos bloques a sangre */
.vg-lp .vg-sec--oferta>.vg-wrap>.vg-kicker{color:#B9B29C}
.vg-lp .vg-sec--oferta>.vg-wrap>.vg-h2{color:var(--surface)}

.vg-lp .vg-wrap{max-width:760px;margin:0 auto;padding:0 22px}
.vg-lp .vg-wrap--wide{max-width:1080px;margin:0 auto;padding:0 22px}
.vg-lp .vg-center{text-align:center}

/* ============ EL MOTIVO: LA LINGUETTA ============
   Fila de 8 pestañas sobre una línea base, en el orden canónico. */
.vg-lp .vg-motivo{display:flex;gap:3px;justify-content:center;align-items:flex-end;width:max-content;margin:0 auto;border-bottom:1px solid var(--filet);padding:0 10px}
.vg-lp .vg-motivo i{display:block;width:24px;height:11px;border-radius:5px 5px 0 0}
.vg-lp .vg-motivo i:nth-child(1){background:var(--c1)}
.vg-lp .vg-motivo i:nth-child(2){background:var(--c2)}
.vg-lp .vg-motivo i:nth-child(3){background:var(--c3)}
.vg-lp .vg-motivo i:nth-child(4){background:var(--c4)}
.vg-lp .vg-motivo i:nth-child(5){background:var(--c5)}
.vg-lp .vg-motivo i:nth-child(6){background:var(--c6)}
.vg-lp .vg-motivo i:nth-child(7){background:var(--c7)}
.vg-lp .vg-motivo i:nth-child(8){background:var(--c8)}
.vg-lp .vg-motivo--sep{margin:0 auto 26px}

/* La pestaña que asoma arriba de cada ficha. */
.vg-lp .vg-tab{position:absolute;top:-23px;left:14px;height:23px;min-width:46px;padding:0 12px;display:flex;align-items:center;justify-content:center;border-radius:6px 6px 0 0;border:1px solid var(--filet);border-bottom:0;font-family:var(--sans);font-weight:600;font-size:11px;letter-spacing:.10em;text-transform:uppercase;color:var(--tx-h);font-variant-numeric:tabular-nums}
.vg-lp .vg-b1{background:var(--c1)} .vg-lp .vg-b2{background:var(--c2)}
.vg-lp .vg-b3{background:var(--c3)} .vg-lp .vg-b4{background:var(--c4)}
.vg-lp .vg-b5{background:var(--c5)} .vg-lp .vg-b6{background:var(--c6)}
.vg-lp .vg-b7{background:var(--c7)} .vg-lp .vg-b8{background:var(--c8)}
.vg-lp .vg-b0{background:var(--surface)}

/* ============ TIPOGRAFÍA ============ */
.vg-lp .vg-h1{font-family:var(--disp);font-weight:700;font-size:clamp(31px,5.2vw,54px);line-height:1.12;color:var(--tx-h);margin:0 0 18px;letter-spacing:-.012em}
.vg-lp .vg-h2{font-family:var(--disp);font-weight:700;font-size:clamp(26px,3.8vw,36px);line-height:1.18;color:var(--tx-h);margin:0 0 16px;letter-spacing:-.01em}
.vg-lp .vg-h3{font-family:var(--disp);font-weight:600;font-size:21px;line-height:1.28;color:var(--tx-h);margin:0 0 8px}
.vg-lp .vg-kicker{font-family:var(--sans);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.10em;color:var(--tx-lb);margin:0 0 14px}
.vg-lp .vg-lead{font-size:19px;line-height:1.62;margin:0 0 20px}
.vg-lp .vg-sub{font-size:15px;color:var(--tx-lb);margin:10px 0 0}
.vg-lp .vg-em{color:var(--tx-h);font-weight:600}
/* El resaltador: trazo plano detrás del texto. Uno por pieza. */
.vg-lp .vg-hl{box-shadow:inset 0 -.46em 0 var(--valor);padding:0 .08em}

/* ============ LA FICHA ============
   Radio 4px · borde 1px · sin sombra difusa. Profundidad por APILADO:
   una segunda ficha asoma 6px abajo y a la derecha. */
.vg-lp .vg-card,.vg-lp .vg-pain,.vg-lp .vg-ben,.vg-lp .vg-step-card{position:relative;background:var(--surface);border:1px solid var(--filet);border-radius:4px;padding:0 0 22px;margin-top:23px;box-shadow:6px 6px 0 -1px var(--surface),6px 6px 0 0 var(--filet)}
.vg-lp .vg-card-in,.vg-lp .vg-pain-in,.vg-lp .vg-ben-in,.vg-lp .vg-step-in{padding:22px 22px 0}
.vg-lp .vg-cards{display:grid;gap:26px 24px}
@media(min-width:720px){.vg-lp .vg-cards{grid-template-columns:repeat(2,1fr)}}
@media(min-width:860px){.vg-lp .vg-cards--3{grid-template-columns:repeat(3,1fr)}}
.vg-lp .vg-card-tag{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.10em;color:var(--tx-lb);margin:0 0 8px}
.vg-lp .vg-card-body{font-size:16px;margin:0}
.vg-lp .vg-card-img{border:1px solid var(--filet);border-radius:3px;margin:0 0 16px;background:var(--paper);width:100%;aspect-ratio:1/1;object-fit:cover}

/* ============ BOTONES ============ */
.vg-lp .vg-btn{display:inline-block;font-family:var(--sans);font-weight:600;font-size:17px;line-height:1.25;text-align:center;text-decoration:none;padding:17px 30px 15px;border-radius:6px;background:var(--acento);color:var(--surface);border:1px solid var(--acento);border-bottom:3px solid var(--acento-d);transition:transform .06s ease}
.vg-lp .vg-btn:hover{transform:translateY(1px)}
.vg-lp .vg-btn:active{transform:translateY(2px);border-bottom-width:1px;padding-bottom:17px}
.vg-lp .vg-btn-note{font-size:14px;color:var(--tx-lb);margin:12px 0 0}

/* ============ HERO ============ */
.vg-lp .vg-hero{padding:56px 0 54px;background:var(--paper)}
.vg-lp .vg-hero-img{max-width:760px;margin:0 auto 30px;border:1px solid var(--filet);border-radius:4px;overflow:hidden;box-shadow:6px 6px 0 -1px var(--surface),6px 6px 0 0 var(--filet)}
.vg-lp .vg-hero-badges{display:flex;flex-wrap:wrap;gap:10px 18px;justify-content:center;margin:26px 0 0}
.vg-lp .vg-hero-badge{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.10em;color:var(--tx-lb)}

@media(max-width:560px){
  .vg-lp .vg-hero{padding:24px 0 40px}
  .vg-lp .vg-hero .vg-motivo--sep{margin-bottom:14px}
  .vg-lp .vg-hero .vg-kicker{margin-bottom:10px}
  .vg-lp .vg-hero .vg-h1{font-size:29px;margin-bottom:12px}
  .vg-lp .vg-hero .vg-lead{font-size:16px;line-height:1.5;margin-bottom:14px}
  .vg-lp .vg-hero-img{margin-bottom:18px}
}

/* ============ DOLORES Y BENEFICIOS ============ */
.vg-lp .vg-pains,.vg-lp .vg-bens{display:grid;gap:22px 24px;margin:20px 0 0}
@media(min-width:720px){
  .vg-lp .vg-pains{grid-template-columns:repeat(2,1fr)}
  .vg-lp .vg-bens{grid-template-columns:repeat(3,1fr)}
}

/* ============ SECCIÓN FIRMA: L'INDICE A 3 CHIAVI ============ */
.vg-lp .vg-keys{display:grid;gap:14px;margin:28px 0 0}
@media(min-width:760px){.vg-lp .vg-keys{grid-template-columns:repeat(3,1fr)}}
.vg-lp .vg-key label{display:block;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.10em;color:var(--tx-lb);margin:0 0 6px}
.vg-lp .vg-key select{width:100%;font-family:var(--sans);font-size:17px;font-weight:500;color:var(--tx-h);background:var(--surface);border:1px solid var(--acento);border-bottom:3px solid var(--acento-d);border-radius:6px;padding:13px 14px;cursor:pointer}
.vg-lp .vg-scheda{position:relative;max-width:620px;margin:50px auto 0;background:var(--surface);border:1px solid var(--filet);border-radius:4px;padding:26px 26px 24px;box-shadow:6px 6px 0 -1px var(--surface),6px 6px 0 0 var(--filet);background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 31px,var(--riga) 31px,var(--riga) 32px);background-position:0 96px}
.vg-lp .vg-scheda-area{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.10em;color:var(--tx-lb);margin:0 0 6px}
.vg-lp .vg-scheda-t{font-family:var(--disp);font-weight:700;font-size:28px;line-height:1.15;color:var(--tx-h);margin:0 0 14px}
.vg-lp .vg-scheda-row{display:grid;grid-template-columns:118px 1fr;gap:12px;font-size:16px;line-height:32px;margin:0}
.vg-lp .vg-scheda-row b{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.10em;color:var(--tx-lb)}
.vg-lp .vg-scheda-row span{line-height:1.5;padding:4px 0;background:var(--surface)}
.vg-lp .vg-firma-note{font-size:14px;color:var(--tx-lb);text-align:center;margin:26px 0 0}

/* ============ 3 PASOS ============ */
.vg-lp .vg-steps{display:grid;gap:22px 24px;margin:20px 0 0}
@media(min-width:760px){.vg-lp .vg-steps{grid-template-columns:repeat(3,1fr)}}
.vg-lp .vg-steps-foot{margin:38px 0 0;text-align:center}

/* ============ CARRUSEL (vistazo 4:5) ============ */
.vg-lp .vg-carousel{overflow:hidden;position:relative;margin:26px 0 0}
.vg-lp .vg-carousel-hint{font-size:13px;color:var(--tx-lb);margin:10px 0 0;text-align:center}
.vg-lp .vg-track{display:flex;gap:14px;width:max-content;animation:vg-scroll 56s linear infinite}
.vg-lp .vg-carousel:hover .vg-track{animation-play-state:paused}
@keyframes vg-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){
  .vg-lp .vg-track{animation:none}
  .vg-lp .vg-carousel{overflow-x:auto}
}
.vg-lp .vg-slide{flex:0 0 auto;width:232px}
.vg-lp .vg-slide img{border:1px solid var(--filet);border-radius:3px;background:var(--surface)}
.vg-lp .vg-45{aspect-ratio:4/5;object-fit:cover;width:100%}
.vg-lp .vg-11{aspect-ratio:1/1;object-fit:cover;width:100%}
.vg-lp .vg-169{aspect-ratio:16/9;object-fit:cover;width:100%}
.vg-lp .vg-frame{border:1px solid var(--filet);border-radius:4px;overflow:hidden}

/* ============ CONFRONTO ============ */
.vg-lp .vg-split{display:grid;gap:34px 24px;margin:20px 0 0}
@media(min-width:860px){.vg-lp .vg-split{grid-template-columns:1fr 1fr}}
.vg-lp .vg-split-col{position:relative;background:var(--surface);border:1px solid var(--filet);border-radius:4px;padding:24px 24px 22px;margin-top:23px}
.vg-lp .vg-split-col--bad{background:var(--paper-alt);border-style:dashed}
.vg-lp .vg-split-col--bad .vg-tab{border-style:dashed}
.vg-lp .vg-split-h{font-family:var(--disp);font-weight:600;font-size:21px;color:var(--tx-h);margin:0 0 12px}
.vg-lp .vg-list{list-style:none;margin:0;padding:0}
.vg-lp .vg-list li{padding:10px 0;border-top:1px solid var(--riga);font-size:16px}

/* ============ STACK DE VALOR ============ */
.vg-lp .vg-stack{margin:6px 0 0}
.vg-lp .vg-stack-row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--riga);font-size:16px}
.vg-lp .vg-stack-row--bonus span:first-child::before{content:'';display:inline-block;width:14px;height:8px;border-radius:3px 3px 0 0;background:var(--c2);margin-right:9px;vertical-align:middle}
.vg-lp .vg-val{white-space:nowrap;font-variant-numeric:tabular-nums}
.vg-lp .vg-stack-tot{display:flex;justify-content:space-between;gap:16px;padding:16px 0 0;font-family:var(--disp);font-weight:700;font-size:20px;color:var(--tx-h)}

/* ============ OFERTA Y PRECIO ============ */
.vg-lp .vg-offer-card{position:relative;background:var(--surface);border:1px solid var(--filet);border-radius:4px;padding:30px 26px;margin-top:40px;box-shadow:6px 6px 0 -1px #2A3558,6px 6px 0 0 #46527A}
.vg-lp .vg-price{margin:26px 0 6px;text-align:center}
.vg-lp .vg-price-old{font-size:18px;color:var(--rojo);text-decoration:line-through}
.vg-lp .vg-price-now{font-family:var(--disp);font-weight:700;font-size:clamp(50px,9vw,72px);line-height:1;color:var(--tx-h);display:block;margin:6px 0 0;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.vg-lp .vg-price-note{font-size:14px;color:var(--tx-lb);margin:12px 0 0;text-align:center}
/* El ahorro REMARCADO: el único resaltador de la sección. */
.vg-lp .vg-save--big{display:table;margin:16px auto 0;padding:9px 20px;background:var(--valor);border-radius:3px;font-size:19px;color:var(--tx-h);transform:rotate(-1deg)}
.vg-lp .vg-save--big strong{font-family:var(--disp);font-weight:700;font-size:21px}
.vg-lp .vg-gift-note{font-size:15px;color:var(--tx);text-align:center;margin:18px auto 0;max-width:460px}

/* ============ GARANTÍA ============ */
.vg-lp .vg-guarantee{position:relative;background:var(--surface);border:1px solid var(--filet);border-radius:4px;padding:28px 26px 26px;margin-top:23px;box-shadow:6px 6px 0 -1px var(--surface),6px 6px 0 0 var(--filet)}

/* ============ FAQ ============ */
.vg-lp .vg-faq{margin:26px 0 0;border-top:1px solid var(--filet)}
.vg-lp .vg-faq details{border-bottom:1px solid var(--filet);padding:16px 0}
.vg-lp .vg-faq summary{cursor:pointer;list-style:none;font-family:var(--disp);font-weight:600;font-size:19px;color:var(--tx-h);display:flex;justify-content:space-between;gap:14px}
.vg-lp .vg-faq summary::-webkit-details-marker{display:none}
.vg-lp .vg-faq summary::after{content:'+';color:var(--acento);font-family:var(--sans);font-size:22px;line-height:1}
.vg-lp .vg-faq details[open] summary::after{content:'–'}
.vg-lp .vg-faq-a{margin:12px 0 0;font-size:16px}

/* ============ CTA FINAL Y LEGALES ============ */
.vg-lp .vg-final{padding:60px 0 74px}
.vg-lp .vg-trust{display:flex;flex-wrap:wrap;gap:10px 18px;justify-content:center;margin:24px 0 0;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.10em;color:var(--tx-lb)}
.vg-lp .vg-legal{font-size:13px;color:var(--tx-lb);text-align:center;padding:30px 22px;background:var(--paper-alt)}
.vg-lp .vg-legal p{max-width:720px;margin:0 auto}
.vg-lp .vg-legal a{color:var(--acento)}