/* WONDA · Calculadora de ventas perdidas — GENERADO por tools_web/gen/page_calculadora_ventas.py
   desde el CSS verbatim del paquete de Claude Design. No se edita a mano. */
.vp{--vp-bg:var(--bg);--vp-elev:var(--bg-elev);--vp-elev-2:var(--bg-elev-2);--vp-fg1:var(--fg-1);--vp-fg2:var(--fg-2);--vp-fg3:var(--fg-3);--vp-border:var(--border-1);--vp-accent:var(--accent);--vp-soft:var(--accent-soft);--vp-ink:var(--accent-ink);--vp-on:var(--fg-on-orange);--vp-glow:rgba(249,115,22,.26);--vp-hair:rgba(255,255,255,.06);--vp-ok:#3DD68C;--vp-bad:#F87171;--vp-mono:"JetBrains Mono","SF Mono",ui-monospace,monospace;--vp-sans:Inter,var(--font-sans,system-ui),sans-serif;--vp-e:cubic-bezier(.2,.8,.2,1);--vp-pad:clamp(80px,9vw,144px);background:var(--vp-bg);color:var(--vp-fg1);font-family:var(--vp-sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;min-height:100vh}
[data-theme="light"] .vp{--vp-hair:rgba(0,0,0,.06);--vp-ok:#177245;--vp-bad:#B23B2E;--vp-glow:rgba(249,115,22,.16)}
.vp *,.vp *::before,.vp *::after{box-sizing:border-box}
:where(.vp) :where(h1,h2,h3,p,ul,ol,dl,dd,dt,figure,blockquote){margin:0}
.vp :where(p){text-wrap:wrap}
:where(.vp) :where(ul,ol){padding:0;list-style:none}
:where(.vp) a{color:var(--vp-ink);text-decoration:none;transition:color 150ms var(--vp-e)}
:where(.vp) a:hover{color:var(--accent-hover)}
:where(.vp) :where(button,input){font-family:inherit;color:inherit}
.vp :focus-visible{outline:2px solid var(--vp-accent);outline-offset:3px}
.vp-vh{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.vp-wrap{max-width:1280px;margin:0 auto;padding:0 48px}
.vp-ico{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:square}
.vp-eyebrow{font-size:14px;font-weight:500;color:var(--vp-fg3);letter-spacing:-.005em}
.vp-eyebrow b{font-family:var(--vp-mono);font-weight:400;color:var(--vp-ink);margin-right:10px;font-size:13px}
.vp-h2{font-size:clamp(32px,2vw + 16px,52px);line-height:1.05;letter-spacing:-.032em;font-weight:600;text-wrap:balance;max-width:20ch}
.vp-h2 em,.vp-h1 em{font-style:normal;color:var(--vp-ink)}
.vp-src{font-size:12px;line-height:1.55;color:var(--vp-fg3);text-wrap:pretty}
.vp-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:12px 24px;line-height:1.3;border-radius:999px;font-size:15px;font-weight:600;letter-spacing:-.01em;border:1px solid transparent;background:none;cursor:pointer;white-space:nowrap;transition:background 150ms var(--vp-e),border-color 150ms var(--vp-e),color 150ms var(--vp-e)}
.vp a.vp-btn-1,.vp .vp-btn-1,.vp .vp-btn-1 *{color:var(--vp-on)}
.vp-btn-1{background:var(--vp-accent);box-shadow:0 0 0 1px rgba(249,115,22,.4),0 8px 32px var(--vp-glow)}
.vp-btn-1:hover{background:var(--accent-hover)}
.vp-btn-1:active{background:var(--accent-press)}
.vp a.vp-btn-2,.vp .vp-btn-2{border-color:var(--vp-border);color:var(--vp-fg1)}
.vp .vp-btn-2:hover{border-color:var(--vp-fg3);background:var(--vp-hair)}
.vp-btn[disabled]{opacity:.45;cursor:default;box-shadow:none}
.vp-btn .vp-ico{width:16px;height:16px}
.vp-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:14.5px;font-weight:600;color:var(--vp-fg1)}
.vp .vp-link{color:var(--vp-fg1)}
.vp .vp-link:hover{color:var(--vp-ink)}
.vp-link .vp-ico{width:16px;height:16px;color:var(--vp-accent)}

/* herramienta */
.vp-hero{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(40px,5vw,80px);align-items:stretch;padding-top:clamp(28px,3vw,44px)}
.vp-crumb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;color:var(--vp-fg3)}
.vp .vp-crumb a{color:var(--vp-fg3)}
.vp .vp-crumb a:hover{color:var(--vp-fg1)}
.vp-crumb .vp-ico{width:12px;height:12px}
.vp-h1{margin-top:20px;font-size:clamp(40px,2.6vw + 16px,68px);line-height:1;letter-spacing:-.038em;font-weight:600;text-wrap:balance}
.vp-say{margin-top:clamp(28px,3vw,44px);font-size:clamp(21px,.9vw + 13px,28px);line-height:2.05;letter-spacing:-.016em;color:var(--vp-fg2);text-wrap:pretty;max-width:31em}
.vp-w{display:inline-block;vertical-align:baseline;height:1.45em;min-width:2.2ch;padding:0 .14em;margin:0 .06em;border:0;border-bottom:2px solid var(--vp-fg3);border-radius:4px 4px 0 0;background:var(--vp-hair);font-family:var(--vp-mono);font-size:.94em;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--vp-fg1);text-align:center;outline:0;transition:border-color 150ms var(--vp-e),background 150ms var(--vp-e),width 150ms var(--vp-e)}
.vp-w:hover{border-bottom-color:var(--vp-fg2)}
.vp-w:focus{border-bottom-color:var(--vp-accent);background:var(--vp-soft)}
.vp-w.bad{border-bottom-color:var(--vp-bad);color:var(--vp-bad)}
.vp-seg{display:inline-flex;vertical-align:.18em;gap:2px;padding:3px;margin:0 .1em;border:1px solid var(--vp-border);border-radius:999px;line-height:1}
.vp-seg button{min-height:34px;padding:0 13px;border:0;border-radius:999px;background:none;font-size:14.5px;font-weight:500;letter-spacing:-.01em;color:var(--vp-fg3);cursor:pointer;transition:background 150ms var(--vp-e),color 150ms var(--vp-e)}
.vp-seg button:hover{color:var(--vp-fg1)}
.vp-seg button[aria-pressed="true"]{background:var(--vp-soft);color:var(--vp-fg1);box-shadow:inset 0 0 0 1px var(--vp-accent)}
.vp-hint{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-top:26px;padding-top:16px;border-top:1px solid var(--vp-border);min-height:66px}
.vp-hint p{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.5;color:var(--vp-fg3);max-width:56ch;text-wrap:pretty}
.vp-hint p .vp-ico{width:16px;height:16px;margin-top:2px;color:var(--vp-fg3)}
.vp-hint p.bad{color:var(--vp-bad)}
.vp-hint p.bad .vp-ico{color:var(--vp-bad)}
.vp-reset{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:0 12px;margin:-8px -12px 0 0;border:0;border-radius:999px;background:none;cursor:pointer;font-size:13px;font-weight:500;color:var(--vp-fg2);white-space:nowrap}
.vp-reset:hover{color:var(--vp-fg1);background:var(--vp-hair)}
.vp-reset .vp-ico{width:14px;height:14px}
.vp-reset[disabled]{opacity:.4;cursor:default;background:none}
.vp-res{position:relative;display:flex;flex-direction:column;gap:22px;padding:clamp(28px,2.4vw,40px);border:1px solid var(--vp-border);border-radius:20px;background:var(--vp-elev);box-shadow:inset 0 1px 0 rgba(255,255,255,.04);min-width:0}
.vp-res-l{font-size:15px;font-weight:500;color:var(--vp-fg2)}
.vp-big{display:block;margin-top:14px;font-family:var(--vp-mono);font-weight:400;font-size:clamp(60px,3.6vw + 22px,104px);line-height:.88;letter-spacing:-.055em;font-variant-numeric:tabular-nums;color:var(--vp-fg1);white-space:nowrap;animation:vpFade 280ms var(--vp-e) both}
.vp-big.is-long{font-size:clamp(44px,2.4vw + 18px,72px)}
.vp-big em{font-style:normal;font-size:.26em;letter-spacing:0;color:var(--vp-fg3);margin-left:.4em;vertical-align:.18em}
.vp-res-n{margin-top:14px;font-size:14px;color:var(--vp-fg3)}
.vp-leak{display:flex;flex-direction:column;gap:12px;padding-top:22px;border-top:1px solid var(--vp-border)}
.vp-strip{display:flex;gap:3px;height:14px}
.vp-strip i{display:block;height:100%;border-radius:3px;transition:flex-grow 380ms var(--vp-e)}
.vp-strip .a{background:var(--vp-fg3);opacity:.32}
.vp-strip .b{background:var(--vp-accent)}
.vp-strip-k{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--vp-fg3)}
.vp-strip-k b{font-family:var(--vp-mono);font-weight:400;color:var(--vp-fg1);margin-right:6px}
.vp-strip-k .is-o{color:var(--vp-ink)}
.vp-flow{display:flex;align-items:baseline;gap:12px;font-size:15px;line-height:1.4;color:var(--vp-fg2);text-wrap:pretty}
.vp-flow b{font-family:var(--vp-mono);font-weight:400;font-size:26px;letter-spacing:-.03em;color:var(--vp-ink);white-space:nowrap}
.vp-res-a{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:auto;padding-top:22px;border-top:1px solid var(--vp-border)}
.vp-sent{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--vp-fg2)}
.vp-sent .vp-ico{width:15px;height:15px;color:var(--vp-ok)}
.vp-sent button{border:0;background:none;padding:0 0 0 6px;color:var(--vp-fg1);font-size:13px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:3px;min-height:44px}
.vp-msg{display:flex;flex-direction:column;gap:18px;justify-content:center;flex:1}
.vp-msg p{font-size:clamp(19px,.5vw + 15px,23px);line-height:1.4;letter-spacing:-.018em;color:var(--vp-fg1);text-wrap:pretty}
.vp-ghost{display:flex;flex-direction:column;gap:10px}
.vp-ghost i{display:block;height:12px;border-radius:4px;background:var(--vp-hair)}
@keyframes vpFade{from{opacity:.2}to{opacity:1}}
@keyframes vpUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* secciones */
.vp-sec{padding-top:var(--vp-pad)}
.vp-sec-h{display:flex;flex-direction:column;gap:20px;margin-bottom:clamp(36px,3.5vw,56px)}
.vp-eq{display:flex;flex-wrap:wrap;align-items:stretch;gap:10px}
.vp-eq-i{display:flex;align-items:stretch;gap:10px;flex:1 1 140px;min-width:0}
.vp-op{align-self:center;font-family:var(--vp-mono);font-size:24px;color:var(--vp-fg3);width:18px;text-align:center;flex:none}
.vp-tile{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:18px;min-height:132px;padding:20px 20px 18px;border:1px solid var(--vp-border);border-radius:14px;background:var(--vp-elev);min-width:0}
.vp-tile-v{font-family:var(--vp-mono);font-weight:400;font-size:clamp(20px,1.3vw + 9px,34px);letter-spacing:-.04em;line-height:1;color:var(--vp-fg1);white-space:nowrap}
.vp-tile-u{display:block;margin-top:6px;font-family:var(--vp-sans);font-size:12.5px;letter-spacing:0;color:var(--vp-fg3)}
.vp-tile.is-total .vp-tile-u{color:var(--vp-fg2)}
.vp-tile-l{font-size:13px;line-height:1.35;color:var(--vp-fg3);text-wrap:pretty}
.vp-tile.is-mid .vp-tile-v{color:var(--vp-fg2)}
.vp-eq-i:last-child{flex-grow:1.6}
.vp-tile.is-total{border-color:var(--vp-accent);background:var(--vp-soft);box-shadow:0 0 0 3px var(--vp-glow)}
.vp-tile.is-total .vp-tile-v{color:var(--vp-fg1)}
.vp-tile.is-total .vp-tile-u{display:block;margin-top:6px;font-family:var(--vp-sans);font-size:12.5px;letter-spacing:0;color:var(--vp-fg3)}
.vp-tile.is-total .vp-tile-u{color:var(--vp-fg2)}
.vp-tile-l{color:var(--vp-fg2)}
.vp-assume{display:flex;gap:12px;align-items:flex-start;margin-top:26px;font-size:15px;line-height:1.6;color:var(--vp-fg2);max-width:70ch;text-wrap:pretty}
.vp-assume .vp-ico{margin-top:3px;color:var(--vp-fg3)}
.vp-args{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-top:1px solid var(--vp-border)}
.vp-args > div{display:flex;flex-direction:column;gap:22px;padding:34px 0 0;min-width:0}
.vp-args > div + div{padding-left:clamp(32px,4vw,64px);border-left:1px solid var(--vp-border)}
.vp-args > div:first-child{padding-right:clamp(32px,4vw,64px)}
.vp-args-l{font-size:15px;font-weight:500;color:var(--vp-fg2)}
.vp-marks{display:flex;flex-wrap:wrap;gap:6px}
.vp-mark{position:relative;width:24px;height:38px;border-radius:4px;background:var(--vp-hair);overflow:hidden;animation:vpUp 320ms var(--vp-e) both}
.vp-mark i{position:absolute;left:0;top:0;bottom:0;display:block;background:var(--vp-fg2)}
.vp-mark.is-pay i{background:var(--vp-accent)}
.vp-mark.is-gap{background:none;border:1.5px dashed var(--vp-accent)}
.vp-more{display:flex;align-items:center;padding:0 8px;font-family:var(--vp-mono);font-size:13px;color:var(--vp-fg3)}
.vp-key{display:flex;gap:20px;flex-wrap:wrap;font-size:13px;line-height:1.4;color:var(--vp-fg3)}
.vp-key span{display:inline-flex;align-items:center;gap:8px}
.vp-key i{width:10px;height:15px;border-radius:2px;display:inline-block;flex:none}
.vp-sens{position:relative;display:flex;flex-direction:column;gap:12px;padding-bottom:26px}
.vp-sr{display:grid;grid-template-columns:72px minmax(0,1fr) 136px;column-gap:16px;align-items:center}
.vp-sens-k{font-size:13.5px;color:var(--vp-fg2)}
.vp-bar{position:relative;height:30px;border-radius:5px;background:var(--vp-hair)}
.vp-bar i{position:absolute;left:0;top:0;bottom:0;border-radius:5px;background:var(--vp-accent);transition:width 420ms var(--vp-e)}
.vp-bar i.is-low{background:none;border:1.5px dashed var(--vp-fg3)}
.vp-sens-v{display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-align:right}
.vp-sens-v b{font-family:var(--vp-mono);font-weight:400;font-size:15px;letter-spacing:-.02em;color:var(--vp-fg1);white-space:nowrap}
.vp-sens-v small{font-size:12px;color:var(--vp-fg3)}
.vp-sens-v small.is-up{color:var(--vp-ink)}
.vp-th{position:absolute;top:0;bottom:0;left:88px;right:152px;pointer-events:none}
.vp-th-line{position:absolute;top:-8px;bottom:20px;width:0;border-left:1.5px solid var(--vp-fg1);transition:left 420ms var(--vp-e)}
.vp-th-lbl{position:absolute;bottom:0;font-style:normal;transform:translateX(-50%);width:max-content;font-family:var(--vp-mono);font-size:11.5px;line-height:16px;color:var(--vp-fg1);transition:left 420ms var(--vp-e)}
.vp-plan{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);border:1px solid var(--vp-border);border-radius:20px;background:var(--vp-elev);overflow:hidden}
.vp-plan-l{padding:clamp(28px,3vw,44px);display:flex;flex-direction:column;gap:18px}
.vp-plan-r{padding:clamp(28px,3vw,44px);border-left:1px solid var(--vp-border);background:var(--vp-bg);display:flex;flex-direction:column;gap:24px}
.vp-price{display:flex;align-items:flex-end;gap:12px;font-family:var(--vp-mono);font-size:clamp(52px,2.4vw + 28px,76px);line-height:.88;letter-spacing:-.055em;color:var(--vp-fg1)}
.vp-price em{font-style:normal;font-family:var(--vp-sans);font-size:15px;letter-spacing:-.01em;color:var(--vp-fg2);padding-bottom:8px}
.vp-plan-d{font-size:15px;line-height:1.6;color:var(--vp-fg2);text-wrap:pretty}
.vp-cond{display:flex;flex-direction:column;gap:8px;padding-top:18px;border-top:1px solid var(--vp-border)}
.vp-cond li{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--vp-fg2)}
.vp-cond .vp-ico{width:15px;height:15px;color:var(--vp-accent)}
.vp-use{display:flex;flex-direction:column;gap:12px}
.vp-use-n{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.vp-use-n p{font-size:15px;font-weight:500;color:var(--vp-fg2)}
.vp-use-n b{font-family:var(--vp-mono);font-weight:400;font-size:clamp(34px,1.4vw + 22px,48px);letter-spacing:-.045em;line-height:1;color:var(--vp-fg1)}
.vp-use-n b.is-over{color:var(--vp-ink)}
.vp-ut{position:relative;display:flex;height:18px;border-radius:5px;background:var(--vp-hair)}
.vp-uf{height:100%;border-radius:5px;background:var(--vp-accent);transition:width 420ms var(--vp-e)}
.vp-uo{height:100%;margin-left:3px;border:1.5px dashed var(--vp-bad);border-radius:0 5px 5px 0}
.vp-ucap{position:absolute;top:-7px;bottom:-7px;width:0;border-left:1.5px solid var(--vp-fg1)}
.vp-use-k{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-family:var(--vp-mono);font-size:12px;color:var(--vp-fg3);font-variant-numeric:tabular-nums}
.vp-over{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1px solid var(--vp-border);border-radius:10px;font-size:14px;line-height:1.5;color:var(--vp-fg1)}
.vp-over .vp-ico{margin-top:1px;color:var(--vp-accent)}
.vp-acts{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.vp-ovw-h{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,4vw,64px);align-items:end;margin-bottom:clamp(36px,3.5vw,52px)}
.vp-ovw-h > p{font-size:16px;line-height:1.6;color:var(--vp-fg3);max-width:40ch;text-wrap:pretty}
.vp-ovw{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:20px}
.vp-vc{border-radius:20px;background:#050506;border:1px solid var(--vp-border);padding:clamp(28px,3vw,38px);display:flex;flex-direction:column;gap:30px;min-width:0}
[data-theme="light"] .vp-vc{background:#FFFFFF}
.vp-vc-top{display:flex;align-items:center;gap:13px}
.vp-vc-top img{width:30px;height:30px;flex:none}
.vp-vc-top p{font-size:13.5px;line-height:1.3;font-weight:600;color:var(--vp-fg1)}
.vp-vc-top span{display:block;margin-top:2px;font-weight:400;font-size:12.5px;color:var(--vp-fg3)}
.vp-vc-q{font-size:clamp(18px,1.05vw + 13px,23px);line-height:1.5;letter-spacing:-.018em;color:var(--vp-fg1);text-wrap:pretty}
.vp-vc-meta{margin-top:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 20px;border-top:1px solid var(--vp-border);padding-top:22px}
.vp-vc-meta div{display:flex;flex-direction:column;gap:8px;min-width:0}
.vp-vc-n{white-space:nowrap;font-family:var(--vp-mono);font-size:24px;line-height:1;letter-spacing:-.03em;font-weight:400;color:var(--vp-fg1)}
.vp-vc-c{font-family:var(--vp-mono);font-size:9.5px;line-height:1.5;letter-spacing:.13em;text-transform:uppercase;color:var(--vp-fg3)}
.vp-vc-sign{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}
.vp-vc-sign p{font-size:15px;font-weight:600;letter-spacing:-.015em;color:var(--vp-fg1)}
.vp-vc-sub{display:block;margin-top:5px;font-family:var(--vp-mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--vp-fg3);font-weight:400}
.vp .vp-vc-go{width:48px;height:48px;flex:none;border-radius:999px;border:1px solid var(--vp-border);background:var(--vp-elev);color:var(--vp-fg1);display:grid;place-items:center;transition:background 150ms var(--vp-e),border-color 150ms var(--vp-e),color 150ms var(--vp-e)}
.vp .vp-vc-go:hover{background:var(--vp-accent);border-color:var(--vp-accent);color:var(--vp-on)}
.vp-ph{position:relative;border-radius:20px;overflow:hidden;min-height:clamp(380px,32vw,470px);display:flex;flex-direction:column;justify-content:space-between;gap:26px;padding:clamp(28px,3vw,38px);min-width:0}
.vp-ph > img,.vp-ph > picture > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.vp-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,8,9,.9) 0%,rgba(8,8,9,.72) 32%,rgba(8,8,9,.36) 58%,rgba(8,8,9,.44) 74%,rgba(8,8,9,.86) 100%)}
.vp-ph-stats{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,46px)}
.vp-ph-stats div{display:flex;flex-direction:column;gap:10px;min-width:0}
.vp-ph-n{font-size:clamp(52px,5vw,84px);line-height:.88;letter-spacing:-.05em;font-weight:600;color:#FBFAF7;font-variant-numeric:tabular-nums}
.vp-ph-n i{font-style:normal;color:#F97316;margin-right:.04em}
.vp-ph-t{font-size:15px;line-height:1.42;color:#EDEBE5;max-width:20ch;text-wrap:pretty}
.vp-ph-foot{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.vp .vp-ph-cta{display:inline-flex;align-items:center;gap:11px;min-height:48px;padding:0 22px 0 18px;border-radius:999px;background:#FBFAF7;color:#141419;font-size:14.5px;font-weight:600;letter-spacing:-.012em}
.vp .vp-ph-cta:hover{background:#fff;color:#141419}
.vp-ph-cta .vp-ico{width:16px;height:16px;color:#141419;stroke-width:2.2}
.vp-ph-src{font-family:var(--vp-mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:#CFCCC4}
.vp-ovw-pie{margin-top:18px}

/* diálogo */
.vp-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px}
.vp-scrim{position:absolute;inset:0;background:rgba(10,10,11,.82);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);animation:vpFade 220ms var(--vp-e) both}
[data-theme="light"] .vp-scrim{background:rgba(247,245,240,.86)}
.vp-dlg{position:relative;width:100%;max-width:860px;max-height:calc(100vh - 48px);overflow-y:auto;border:1px solid var(--vp-border);border-radius:20px;background:var(--vp-elev);box-shadow:0 30px 80px rgba(0,0,0,.45);animation:vpUp 320ms var(--vp-e) both}
.vp-dlg-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px 10px 28px;border-bottom:1px solid var(--vp-border)}
.vp-dlg-top p{font-size:14px;font-weight:600;color:var(--vp-fg1)}
.vp-x{width:44px;height:44px;display:grid;place-items:center;border-radius:999px;border:0;background:none;color:var(--vp-fg2);cursor:pointer}
.vp-x:hover{background:var(--vp-hair);color:var(--vp-fg1)}
.vp-dlg-b{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.vp-dlg-l{padding:28px;display:flex;flex-direction:column;gap:20px}
.vp-dlg-r{padding:28px;border-left:1px solid var(--vp-border);background:var(--vp-bg);display:flex;flex-direction:column;gap:16px;justify-content:center;min-height:320px}
.vp-dlg-big{font-family:var(--vp-mono);font-size:44px;line-height:.9;letter-spacing:-.05em;color:var(--vp-fg1)}
.vp-dlg-big em{font-style:normal;font-size:.34em;color:var(--vp-fg3);margin-left:.35em;letter-spacing:0}
.vp-dlg-get{font-size:15px;line-height:1.55;color:var(--vp-fg2);text-wrap:pretty}
.vp-dlg-sum{display:flex;flex-direction:column;border-top:1px solid var(--vp-border)}
.vp-dlg-sum div{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--vp-border);font-size:13.5px;color:var(--vp-fg3)}
.vp-dlg-sum dd{font-family:var(--vp-mono);color:var(--vp-fg1)}
.vp-sign{display:flex;align-items:center;gap:10px;margin-top:auto;font-size:12.5px;color:var(--vp-fg3)}
.vp-sign svg{width:22px;height:22px;flex:none}
.vp-ffld{display:flex;flex-direction:column;gap:8px}
.vp-ffld label{font-size:13px;font-weight:500;color:var(--vp-fg2)}
.vp-ffld label i{font-style:normal;color:var(--vp-fg3);font-weight:400}
.vp-ffld input{min-height:50px;padding:0 14px;border-radius:10px;border:1px solid var(--vp-border);background:var(--vp-elev);color:var(--vp-fg1);font-size:15px;width:100%;transition:border-color 150ms var(--vp-e),box-shadow 150ms var(--vp-e)}
.vp-ffld input::placeholder{color:var(--vp-fg3)}
.vp-ffld input:focus{outline:0;border-color:var(--vp-accent);box-shadow:0 0 0 3px var(--vp-glow)}
.vp-ffld.bad input{border-color:var(--vp-bad)}
.vp-chk{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--vp-fg3);min-height:18px}
.vp-chk .vp-ico{width:14px;height:14px;color:var(--vp-ok)}
.vp-err{display:flex;align-items:flex-start;gap:7px;font-size:12.5px;line-height:1.45;color:var(--vp-bad)}
.vp-err .vp-ico{width:14px;height:14px;margin-top:2px}
.vp-send{align-self:flex-start;min-width:230px}
.vp-legal{font-size:11.5px;line-height:1.5;color:var(--vp-fg3);text-wrap:pretty}
.vp .vp-legal a{color:var(--vp-fg2);text-decoration:underline;text-underline-offset:2px}
.vp-spin{width:16px;height:16px;flex:none;animation:vpSpin 900ms linear infinite}
@keyframes vpSpin{to{transform:rotate(360deg)}}
.vp-ok-h{display:flex;align-items:center;gap:12px}
.vp-ring{width:36px;height:36px;border-radius:999px;display:grid;place-items:center;background:var(--vp-soft);border:1px solid rgba(249,115,22,.4);flex:none;color:var(--vp-ink)}
.vp-ring .vp-ico{width:16px;height:16px}
.vp-ring.is-bad{background:none;border-color:var(--vp-bad);color:var(--vp-bad)}
.vp-ok-h p{font-size:18px;font-weight:600;letter-spacing:-.015em;color:var(--vp-fg1)}
.vp-ok-t{font-size:14px;line-height:1.55;color:var(--vp-fg2)}
.vp-ok-t b{color:var(--vp-fg1);font-weight:600;word-break:break-all}
.vp-next{border-top:1px solid var(--vp-border);padding-top:10px;display:flex;flex-direction:column}
.vp-queued{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;font-size:12.5px;color:var(--vp-fg2);border:1px dashed var(--vp-border);border-radius:999px;padding:8px 14px}
.vp-queued .vp-ico{width:14px;height:14px;color:var(--vp-accent)}

/* v2 · tarjeta del resultado: línea del plan (§3.3) y copiar el enlace (E) */
.vp-pay{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding-top:18px;border-top:1px solid var(--vp-border);font-size:14.5px;line-height:1.4;color:var(--vp-fg2);text-wrap:pretty}
.vp-pay b{font-family:var(--vp-mono);font-weight:400;font-size:15px;letter-spacing:-.02em;color:var(--vp-fg1);white-space:nowrap}
.vp .vp-pay a{color:var(--vp-fg1);font-weight:600;white-space:nowrap}
.vp .vp-pay a:hover{color:var(--vp-ink)}
.vp-share{display:flex;align-items:center;margin:-10px 0 -8px -12px}
.vp-copy{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 12px;border:0;border-radius:999px;background:none;cursor:pointer;font-size:13px;font-weight:500;line-height:1.35;text-align:left;color:var(--vp-fg2);transition:background 150ms var(--vp-e),color 150ms var(--vp-e)}
.vp-copy:hover{color:var(--vp-fg1);background:var(--vp-hair)}
.vp-copy .vp-ico{width:15px;height:15px}
.vp-copy.is-ok{color:var(--vp-fg1)}
.vp-copy.is-ok .vp-ico{color:var(--vp-ok)}
.vp-copy.is-bad,.vp-copy.is-bad:hover{color:var(--vp-bad);background:none}

/* v2 · cifra en móvil (§3.2) */
.vp-mres{display:none}
.vp a.vp-mres{color:var(--vp-fg1)}
.vp-mres-l{display:block;font-size:13px;line-height:1.3;color:var(--vp-fg2)}
.vp-mres-n{display:block;margin-top:4px;font-family:var(--vp-mono);font-size:30px;line-height:1;letter-spacing:-.045em;font-variant-numeric:tabular-nums;color:var(--vp-fg1);white-space:nowrap}
.vp-mres-n em{font-style:normal;font-size:.44em;letter-spacing:0;color:var(--vp-fg3);margin-left:.35em}
.vp-mres-go{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--vp-fg2);white-space:nowrap}
.vp-mres-go .vp-ico{width:15px;height:15px;color:var(--vp-accent)}

/* v2 · rótulo de los bloques de servicio (A, C, D) */
.vp-kick{display:flex;align-items:center;gap:10px;font-family:var(--vp-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--vp-fg3)}
.vp-kick::before{content:"";width:22px;height:1px;background:var(--vp-accent);flex:none}

/* v2 · B · Qué es esto */
.vp-def{display:grid;grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:clamp(32px,4vw,56px);border-top:1px solid var(--vp-border);padding-top:40px}
.vp-def-l{padding-top:5px;font-family:var(--vp-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--vp-ink)}
.vp-def-p{font-size:clamp(17.5px,.65vw + 15px,22px);line-height:1.55;letter-spacing:-.012em;color:var(--vp-fg1);text-wrap:pretty;max-width:68ch}
.vp-def-p strong{font-weight:600}

/* v2 · A · Pruébalo antes de pagar */
.vp-try{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);border:1px solid var(--vp-border);border-radius:20px;background:var(--vp-elev);box-shadow:inset 0 1px 0 rgba(255,255,255,.04);overflow:hidden}
.vp-try-l{padding:clamp(28px,3vw,44px);display:flex;flex-direction:column;justify-content:space-between;gap:32px}
.vp-try-d{font-size:clamp(19px,.5vw + 15px,23px);line-height:1.45;letter-spacing:-.018em;color:var(--vp-fg1);max-width:34ch;text-wrap:pretty}
.vp-try-r{padding:clamp(28px,3vw,44px);border-left:1px solid var(--vp-border);background:var(--vp-bg);display:flex;flex-direction:column;gap:22px}
.vp-who{display:flex;align-items:center;gap:14px}
.vp-who img{width:56px;height:56px;border-radius:999px;object-fit:cover;object-position:50% 25%;flex:none;border:1px solid var(--vp-border)}
.vp-who-n{font-size:16px;font-weight:600;letter-spacing:-.015em;line-height:1.3;color:var(--vp-fg1);min-width:0}
.vp-who-sub{display:block;margin-top:4px;font-family:var(--vp-mono);font-weight:400;font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--vp-fg3)}
.vp-st{margin-left:auto;display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border:1px solid var(--vp-border);border-radius:999px;font-size:12px;line-height:1.3;color:var(--vp-fg2);white-space:nowrap}
.vp-st-dot{width:7px;height:7px;border-radius:999px;background:var(--vp-ok);flex:none}
.vp-st.is-chat .vp-st-dot{background:var(--vp-fg3)}
.vp-chan{border-top:1px solid var(--vp-border)}
.vp-chan li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:14px;padding:16px 0;border-bottom:1px solid var(--vp-border)}
.vp-chan .vp-ico{margin-top:2px;color:var(--vp-accent)}
.vp-chan li.is-off .vp-ico{color:var(--vp-fg3)}
.vp-chan-k{display:block;font-size:14.5px;font-weight:600;color:var(--vp-fg1)}
.vp-chan-t{display:block;margin-top:3px;font-size:13.5px;line-height:1.5;color:var(--vp-fg3);text-wrap:pretty}

/* v2 · C · Límites, nota de datos y firma */
.vp-lim{margin-top:var(--vp-pad);padding:var(--vp-pad) 0;background:var(--vp-elev);border-top:1px solid var(--vp-border);border-bottom:1px solid var(--vp-border)}
.vp-lim-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:40px;border-top:1px solid var(--vp-border)}
.vp-lim-g li{padding:28px 32px 4px 0;display:flex;flex-direction:column;gap:14px;min-width:0}
.vp-lim-g li + li{padding-left:32px;border-left:1px solid var(--vp-border)}
.vp-lim-n{font-family:var(--vp-mono);font-size:12px;letter-spacing:.06em;color:var(--vp-ink)}
.vp-lim-t{font-size:16px;line-height:1.6;color:var(--vp-fg2);text-wrap:pretty}
.vp-lim-b{display:block;font-size:clamp(19px,.4vw + 16px,22px);line-height:1.25;letter-spacing:-.02em;font-weight:600;color:var(--vp-fg1);margin-bottom:10px}
.vp-note{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,4vw,64px);align-items:center;padding-top:38px}
.vp-sig{display:flex;align-items:center;gap:16px}
.vp-sig img{width:56px;height:56px;border-radius:999px;object-fit:cover;object-position:50% 22%;flex:none}
.vp-sig-t{font-size:14px;line-height:1.45;color:var(--vp-fg2)}
.vp-sig-n{display:block;font-size:15px;font-weight:600;color:var(--vp-fg1)}
.vp-note-t{display:flex;flex-direction:column;gap:8px}
.vp-note-k{font-family:var(--vp-mono);font-size:10.5px;line-height:1.55;letter-spacing:.1em;text-transform:uppercase;color:var(--vp-fg3)}
.vp-note-p{font-size:14px;line-height:1.6;color:var(--vp-fg2);text-wrap:pretty}


/* v2 · éxito de la ficha: el siguiente paso puede ser un botón (voz/chat) */
.vp-next button.vp-link{border:0;background:none;padding:0;cursor:pointer;text-align:left}


@media (prefers-reduced-motion:reduce){.vp *{animation:none !important;transition:none !important}}
@media (max-width:1080px){.vp-hero{grid-template-columns:minmax(0,1fr)}.vp-say{max-width:none}.vp-vc-meta{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.vp-vc-meta{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){
  .vp-args,.vp-plan,.vp-ovw,.vp-ovw-h,.vp-dlg-b{grid-template-columns:minmax(0,1fr)}
  .vp-try,.vp-note{grid-template-columns:minmax(0,1fr)}
  .vp-try-r{border-left:0;border-top:1px solid var(--vp-border)}
  .vp-args > div + div{padding-left:0;border-left:0;border-top:1px solid var(--vp-border);margin-top:34px}
  .vp-args > div:first-child{padding-right:0}
  .vp-plan-r,.vp-dlg-r{border-left:0;border-top:1px solid var(--vp-border)}
  .vp-dlg-r{min-height:0}
}
@media (max-width:768px){
  .vp-wrap{padding-left:20px;padding-right:20px}
  .vp-mres{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:20px;padding:14px 16px;border:1px solid var(--vp-border);border-radius:14px;background:var(--vp-elev)}
  .vp-def{grid-template-columns:minmax(0,1fr);gap:12px;padding-top:28px}
  .vp-lim-g{grid-template-columns:minmax(0,1fr)}
  .vp-lim-g li,.vp-lim-g li + li{padding:24px 0 20px;border-left:0}
  .vp-lim-g li + li{border-top:1px solid var(--vp-border)}
  .vp-who{flex-wrap:wrap}
  .vp-say{line-height:2.2}
  .vp-seg button{min-height:40px}
  .vp-res{border-radius:16px}
  .vp-eq-i{flex:1 1 100%}
  .vp-eq-i .vp-op{width:18px}
  .vp-tile{min-height:0;flex-direction:row;align-items:baseline;justify-content:space-between}
  .vp-modal{align-items:end;padding:0}
  .vp-dlg{border-radius:20px 20px 0 0;max-height:92vh;border-bottom:0}
  .vp-dlg-l,.vp-dlg-r{padding:22px 20px}
  .vp-sign{display:none}
}
@media (max-width:520px){
  .vp-sr{grid-template-columns:minmax(0,1fr) 112px;row-gap:6px}
  .vp-sens-k{grid-column:1 / -1}
  .vp-th{display:none}
  .vp-ph-stats{grid-template-columns:1fr;gap:22px}
  .vp-ph-t{max-width:none}
  .vp-vc-meta{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vp-send{width:100%;min-width:0}
  .vp-btn{white-space:normal}
}

/* ============ Adaptaciones al sitio (no son diseño nuevo) ============ */
/* La cabecera del sitio es fija y mide 68 px: el prototipo la simulaba en el flujo (52 px + 12). */
.vp{padding-top:68px}
/* v2 · la última sección (Pruébalo) termina en una tarjeta, sin cierre detrás: el prototipo separa
   el pie con `margin-top:var(--vp-pad)` en el marcador del pie congelado, que no se publica. El
   pie real del sitio no trae ese margen: sin esto, la tarjeta quedaba pegada al pie. */
.vp{padding-bottom:var(--vp-pad)}
/* v2 · «Pierdes al mes · Ver la cuenta» (hasta 768 px) baja a #resultado: la cabecera fija del sitio (68 px) tapaba
   el principio de la tarjeta (medido: top 0). En el prototipo la cabecera va en el flujo. */
#resultado{scroll-margin-top:84px}
/* El diálogo va por encima de la cabecera fija (z 200), la barra fija inferior de móvil (z 290) y
   el menú móvil (z 300/310), como pide el brief §10.11: la barra no tapa la ficha. */
.vp-modal{z-index:320}
/* base.css pone `picture{display:contents}`: el <source> de la foto se volvía un tercer hijo de la
   tarjeta flexible y bajaba las cifras ×7 / ×60 al centro (medido: 134 px a 1440). El prototipo
   usa un <img> suelto. v2: lo mismo con la cara de Wondy y el retrato de la firma, que también van
   en <picture> (webp + png, los activos del sitio) dentro de una fila flexible. */
.vp-ph picture > source,.vp-who picture > source,.vp-sig picture > source{display:none}
/* v2 · `hidden` es lo que el HTML servido pone a «Copiar el enlace» y al botón de voz (INSTRUCCIONES §3).
   base.css no tiene regla para [hidden] y `.vp-btn{display:inline-flex}` la pisaría. */
.vp [hidden]{display:none !important}
/* v2 · la hoja A4 de la cuenta (VP.cuenta.hoja del paquete) solo existe para imprimir, como #nc-print en
   la nómina. Se pinta al imprimir y solo si hay cuenta (clase en <html>); sin cuenta se imprime la página. */
#vp-print{display:none}
@media print{
  @page{size:A4;margin:0}
  html.vp-imprime body > :not(#vp-print){display:none !important}
  html.vp-imprime body{background:#fff !important;padding:0 !important;margin:0 !important}
  html.vp-imprime #vp-print{display:block}
  #vp-print section{margin:0 !important;break-after:page}
  #vp-print section:last-child{break-after:auto}
}