/* ============================================================
   VELTRIC — Landing Pages compartidas (TOFU / MOFU / BOFU)  v2
   Dark/teal minimalista · más visual · menos texto
   ============================================================ */
:root{
  --black:#060a0b; --dark:#0b1517; --dark2:#0f1d20; --teal:#1a3d48;
  --accent:#4a9aad; --accent2:#7fd0e2; --cream:#F6F7F2; --white:#fff;
  --sub:#a4bcc2; --muted:#5f7c82; --border:rgba(255,255,255,0.08);
  --good:#4a9aad; --bad:#e8836f; --gold:#d8b677;
  --r:14px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Outfit',sans-serif;background:var(--black);color:var(--cream);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;line-height:1.6;font-size:16px}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:0 auto;padding:0 40px}
.narrow{max-width:920px}
.center{text-align:center}
:focus-visible{outline:2px solid var(--accent2);outline-offset:3px;border-radius:3px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}

/* ── NAV ── */
nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:0 40px;
  transition:background .4s,border-color .4s;border-bottom:1px solid transparent;
  background:rgba(6,10,11,.72);backdrop-filter:blur(14px)}
nav.scrolled{background:rgba(6,10,11,.97);border-color:var(--border)}
.nav-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:70px}
.nav-logo img{height:23px;width:auto}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-links a{font-size:11px;font-weight:500;color:rgba(246,247,242,.6);letter-spacing:1.6px;text-transform:uppercase;transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--white)}
.nav-cta{background:var(--white);color:var(--black)!important;padding:11px 22px;border-radius:6px;
  font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;transition:transform .2s,background .2s}
.nav-cta:hover{background:var(--cream);transform:translateY(-1px)}
.nav-mobile-cta{display:none}
.nav-burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;padding:10px;margin-left:4px;background:transparent;border:0;cursor:pointer}
.nav-burger span{display:block;height:2px;width:100%;background:var(--white);border-radius:2px;transition:transform .3s,opacity .3s}
.nav-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-burger.open span:nth-child(2){opacity:0}
.nav-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:980px){nav{padding:0 20px}.nav-links{display:none}.nav-mobile-cta{display:block}.nav-burger{display:flex}
  #nav.menu-open .nav-links{display:flex;flex-direction:column;align-items:stretch;gap:0;position:absolute;top:100%;left:0;right:0;background:rgba(6,10,11,.97);backdrop-filter:blur(14px);padding:6px 22px 18px;border-top:1px solid rgba(255,255,255,.08);box-shadow:0 24px 44px rgba(0,0,0,.45)}
  #nav.menu-open .nav-links a{padding:15px 2px;border-bottom:1px solid rgba(255,255,255,.07);width:100%}
  #nav.menu-open .nav-links .nav-cta{margin-top:14px;border-bottom:0;text-align:center}}

/* ── BUTTONS (touch ≥44px) ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 32px;border-radius:8px;
  font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;
  transition:transform .2s,background .2s,box-shadow .2s;white-space:nowrap;cursor:pointer;border:1px solid transparent;min-height:48px}
.btn svg{width:16px;height:16px;flex:0 0 auto}
.btn-primary{background:var(--white);color:var(--black)}
.btn-primary:hover{background:var(--cream);transform:translateY(-2px)}
.btn-accent{background:var(--accent);color:#04181d;box-shadow:0 8px 24px rgba(74,154,173,.25)}
.btn-accent:hover{background:var(--accent2);transform:translateY(-2px);box-shadow:0 12px 32px rgba(74,154,173,.4)}
.btn-outline{background:transparent;color:var(--cream);border-color:rgba(255,255,255,.28)}
.btn-outline:hover{border-color:var(--white);color:var(--white)}
.btn-wa{background:#25d366;color:#04181d}
.btn-wa:hover{background:#33e077;transform:translateY(-2px)}
.btn-lg{padding:19px 42px;font-size:13px}
.btn-block{width:100%}

/* ── TYPO ── */
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:3px;
  text-transform:uppercase;color:var(--accent2);margin-bottom:18px}
.eyebrow::before{content:'';width:24px;height:1px;background:var(--accent)}
.center .eyebrow::before{display:none}
.h1{font-size:clamp(40px,6.2vw,76px);font-weight:800;line-height:1.0;letter-spacing:-2.5px;color:var(--white)}
.h2{font-size:clamp(28px,3.8vw,46px);font-weight:800;line-height:1.08;letter-spacing:-1.4px;color:var(--white)}
.h3{font-size:20px;font-weight:700;letter-spacing:-.3px;color:var(--white)}
.lead{font-size:clamp(16px,1.5vw,19px);color:var(--sub);font-weight:300;line-height:1.65;max-width:600px}
em.it{font-style:italic;color:var(--accent2)}
.muted{color:var(--muted)}
.kicker{font-size:14px;color:var(--sub);font-weight:300;line-height:1.7}

/* ── SECTIONS ── */
section{padding:104px 0;position:relative}
.sec-sm{padding:68px 0}
.sec-dark{background:var(--dark)}
.sec-dark2{background:var(--dark2)}
.sec-head{max-width:680px;margin:0 auto 60px}
.sec-head .lead{margin:16px auto 0}

/* ── REVEAL ── */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:none}

/* ── HERO ── */
.lp-hero{min-height:88vh;display:flex;align-items:center;position:relative;padding:130px 0 90px;overflow:hidden}
.lp-hero-split{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;position:relative;z-index:2}
.lp-hero-art{border-radius:var(--r);overflow:hidden;border:1px solid var(--border);box-shadow:0 30px 80px rgba(0,0,0,.5)}
.lp-hero-art img,.lp-hero-art video{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5;display:block}
.lp-hero-bg{position:absolute;inset:0;z-index:0}
.lp-hero-bg img,.lp-hero-bg video{width:100%;height:100%;object-fit:cover}
.lp-hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,10,11,.96) 0%,rgba(6,10,11,.8) 48%,rgba(6,10,11,.5) 100%)}
.lp-hero .h1{margin-bottom:22px}
.lp-hero .lead{margin-bottom:32px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.trust-inline{display:flex;gap:22px;flex-wrap:wrap;margin-top:30px}
.trust-inline span{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--sub);font-weight:400}
.trust-inline svg{width:16px;height:16px;color:var(--accent2)}

/* ── GRID / CARDS ── */
.grid{display:grid;gap:20px}
.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.card{background:rgba(13,24,26,.7);border:1px solid var(--border);border-radius:var(--r);padding:30px 26px;
  transition:border-color .3s,transform .3s,background .3s}
.card:hover{border-color:rgba(74,154,173,.55);transform:translateY(-4px);background:rgba(13,24,26,.95)}
.card .ic{width:58px;height:58px;border-radius:50%;background:radial-gradient(circle at 32% 28%,rgba(74,154,173,.4),rgba(74,154,173,.1));border:1px solid rgba(74,154,173,.5);box-shadow:0 8px 22px rgba(74,154,173,.15);
  display:flex;align-items:center;justify-content:center;color:var(--accent2);margin-bottom:20px}
.card .ic svg{width:26px;height:26px}
.card h3{margin-bottom:8px}
.card p{font-size:14px;color:var(--sub);font-weight:300;line-height:1.55}

/* ── STAT BAND ── */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.stat{padding:34px 28px;background:rgba(13,24,26,.55);border:1px solid var(--border);border-radius:var(--r)}
.stat .n{font-size:clamp(44px,5vw,66px);font-weight:900;color:var(--white);letter-spacing:-2px;line-height:1;margin-bottom:10px}
.stat .n em{font-style:italic;color:var(--accent2)}
.stat .l{font-size:14px;color:var(--sub);font-weight:300;line-height:1.5}
.stat .src{font-size:10.5px;color:var(--muted);margin-top:10px;letter-spacing:.2px}

/* ── COMPARISON TABLE (Veltric = 1ª columna, con logo) ── */
.vtable-wrap{border:1px solid rgba(74,154,173,.25);border-radius:var(--r);overflow:hidden;
  background:rgba(8,16,18,.85);box-shadow:0 20px 56px rgba(0,0,0,.45)}
.vtable-scroll{overflow-x:auto}
.vtable{width:100%;border-collapse:collapse;min-width:720px}
.vtable th,.vtable td{padding:17px 16px;font-size:14px;text-align:center;border-bottom:1px solid rgba(74,154,173,.1)}
.vtable thead th{font-weight:700;color:rgba(246,247,242,.72);background:rgba(255,255,255,.015);vertical-align:middle;
  font-size:12px;text-transform:uppercase;letter-spacing:.5px;padding:20px 14px}
.vtable td.rowhead,.vtable th.rowhead{text-align:left;color:var(--cream);font-weight:600;background:rgba(255,255,255,.02);
  text-transform:none;letter-spacing:0;width:200px;font-size:13.5px}
/* Columna Veltric (1ª, destacada con logo) */
.vtable .col-v{background:rgba(74,154,173,.13);color:var(--cream);font-weight:600;
  border-left:1px solid rgba(74,154,173,.45);border-right:1px solid rgba(74,154,173,.45)}
.vtable thead th.col-v{background:linear-gradient(180deg,rgba(74,154,173,.28),rgba(74,154,173,.14));
  border-top:3px solid var(--accent);padding:18px 14px 16px}
.vtable .vlogo{height:22px;width:auto;margin:0 auto 6px;display:block}
.vtable thead th.col-v .badge{display:block;font-size:9.5px;color:var(--accent2);letter-spacing:2px;font-weight:700;margin-top:2px}
.vtable tbody tr:last-child td{border-bottom:none}
.vtable tbody tr.strip td{background:rgba(255,255,255,.02)}
.vtable tbody tr.strip td.col-v{background:var(--accent);color:#04181d;font-weight:800;font-size:15px}
.vtable tbody tr.strip td.rowhead{background:var(--teal);color:var(--white)}
.yes{display:inline-flex;align-items:center;justify-content:center;gap:6px;color:var(--accent2);font-weight:700}
.yes svg{width:18px;height:18px}
.no{display:inline-flex;align-items:center;justify-content:center;color:#6c8086}
.no svg{width:15px;height:15px}
.col-v .yes{color:#9fe7c0}
.vfoot{font-size:12px;color:var(--muted);margin-top:14px;line-height:1.5}

/* ── 2-COL CMP (no-brainer) ── */
.cmp{border:1px solid rgba(74,154,173,.3);border-radius:var(--r);overflow:hidden;background:rgba(8,16,18,.85)}
.cmp-row{display:grid;grid-template-columns:1.2fr 2fr 1.6fr;border-bottom:1px solid rgba(74,154,173,.1)}
.cmp-row:last-child{border-bottom:none}
.cmp-row.head>*{padding:16px 22px;font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase}
.cmp-row.head .v{color:#04181d;background:var(--accent);display:flex;align-items:center;gap:8px}
.cmp-row.head .v img{height:16px}
.cmp-row.head .b{color:rgba(246,247,242,.5)}
.cmp .a,.cmp .b,.cmp .v{padding:19px 22px;display:flex;align-items:center;gap:11px;font-size:14px;font-weight:300;line-height:1.45}
.cmp .a{background:rgba(255,255,255,.02);font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:rgba(246,247,242,.82)}
.cmp .v{background:rgba(74,154,173,.12);color:var(--cream);font-weight:500;border-left:1px solid rgba(74,154,173,.3)}
.cmp .b{color:rgba(246,247,242,.55)}
.ic-yes,.ic-no{flex:0 0 auto;width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center}
.ic-yes{color:var(--accent2);background:rgba(74,154,173,.18);border:1px solid rgba(74,154,173,.5)}
.ic-no{color:var(--bad);background:rgba(232,131,111,.12);border:1px solid rgba(232,131,111,.32)}
.ic-yes svg,.ic-no svg{width:13px;height:13px}

/* ── FAQ ── */
.faq{max-width:800px;margin:0 auto}
.faq details{border-bottom:1px solid var(--border)}
.faq details:first-child{border-top:1px solid var(--border)}
.faq summary{list-style:none;cursor:pointer;padding:22px 4px;font-size:16px;font-weight:500;color:var(--cream);
  display:flex;justify-content:space-between;align-items:center;gap:18px;min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq .chev{width:10px;height:10px;border-right:2px solid var(--accent2);border-bottom:2px solid var(--accent2);
  transform:rotate(45deg);transition:transform .25s;flex:0 0 auto;margin-right:6px}
.faq details[open] .chev{transform:rotate(-135deg)}
.faq details p{font-size:14.5px;line-height:1.65;color:var(--sub);padding:0 4px 22px;font-weight:300}

/* ── STEPS ── */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;counter-reset:s;position:relative}
.step{position:relative;padding:28px 22px;background:rgba(13,24,26,.55);border:1px solid var(--border);border-radius:var(--r)}
.step .sn{width:48px;height:48px;border-radius:50%;background:var(--accent);color:#04181d;font-weight:800;font-size:18px;
  display:flex;align-items:center;justify-content:center;margin-bottom:16px;box-shadow:0 6px 16px rgba(74,154,173,.32)}
@media(min-width:981px){.step:not(:last-child)::after{content:'';position:absolute;top:52px;right:-16px;width:22px;height:2px;background:linear-gradient(90deg,var(--accent),rgba(74,154,173,.12));z-index:2}
  .step:not(:last-child)::before{content:'';position:absolute;top:48px;right:-19px;width:8px;height:8px;border-top:2px solid var(--accent);border-right:2px solid var(--accent);transform:rotate(45deg);z-index:2;opacity:.85}}
.step h4{font-size:15px;color:var(--white);font-weight:700;margin-bottom:7px}
.step p{font-size:13px;color:var(--sub);font-weight:300;line-height:1.5}

/* ── SPLIT ── */
.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.split.rev .split-media{order:2}
.split-media{border-radius:var(--r);overflow:hidden;border:1px solid var(--border);box-shadow:0 24px 60px rgba(0,0,0,.4)}
.split-media img,.split-media video{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5;display:block}
.split-body .h2{margin-bottom:18px}
.split-body p{color:var(--sub);font-weight:300;font-size:15.5px;line-height:1.7;margin-bottom:14px}
.checklist{list-style:none;margin-top:20px;display:flex;flex-direction:column;gap:14px}
.checklist li{display:flex;gap:13px;align-items:flex-start;font-size:15px;color:var(--cream);font-weight:300;line-height:1.45}
.checklist li svg{width:22px;height:22px;flex:0 0 auto;color:var(--accent2);margin-top:1px}
.checklist li strong{color:var(--white);font-weight:600}

/* ── OFFER / PRICING (BOFU) ── */
.urgency{background:var(--accent);color:#04181d;text-align:center;padding:11px 16px;font-size:13px;font-weight:700;
  letter-spacing:.4px;display:flex;align-items:center;justify-content:center;gap:10px;position:relative;z-index:101}
.urgency svg{width:16px;height:16px}
.price-card{background:linear-gradient(165deg,rgba(26,61,72,.6),rgba(11,21,23,.96));border:1px solid rgba(74,154,173,.45);
  border-radius:18px;padding:14px 40px 40px;box-shadow:0 30px 70px rgba(0,0,0,.5);position:relative;overflow:hidden}
.price-ribbon{margin:-14px -40px 22px;background:var(--gold);color:#1a1206;text-align:center;padding:9px;font-size:11px;
  font-weight:800;letter-spacing:2px;text-transform:uppercase}
.price-plan{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--accent2);font-weight:700;margin-bottom:10px}
.price-amount{font-size:clamp(34px,4.6vw,46px);font-weight:900;color:var(--white);letter-spacing:-1.4px;line-height:1;white-space:nowrap}
.price-amount small{font-size:16px;font-weight:400;color:var(--sub);letter-spacing:0}
.price-sub{font-size:14px;color:var(--sub);margin:8px 0 22px;font-weight:300}
.vstack{list-style:none;margin:0 0 8px;display:flex;flex-direction:column}
.vstack li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 0;border-bottom:1px dashed var(--border);font-size:14.5px}
.vstack li:last-child{border-bottom:none}
.vstack .vi{display:flex;align-items:flex-start;gap:11px;color:var(--cream);font-weight:300;line-height:1.4}
.vstack .vi svg{width:20px;height:20px;flex:0 0 auto;color:var(--accent2);margin-top:1px}
.vstack .vi strong{color:var(--white);font-weight:600}
.vstack .va{font-size:12.5px;color:var(--muted);text-decoration:line-through;white-space:nowrap;flex:0 0 auto}
.vstack .vinc{font-size:11px;color:var(--accent2);font-weight:700;letter-spacing:.5px;white-space:nowrap;flex:0 0 auto}
.total-row{display:flex;justify-content:space-between;align-items:center;margin:18px 0 22px;padding:16px 18px;
  background:rgba(74,154,173,.12);border:1px solid rgba(74,154,173,.3);border-radius:10px}
.total-row .tl{font-size:13px;color:var(--sub);font-weight:400}
.total-row .tl s{color:var(--muted)}
.total-row .tr{font-size:17px;color:var(--white);font-weight:800}
.badges{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:18px 0}
.badge-pill{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.4px;
  padding:7px 13px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid var(--border);color:var(--cream)}
.badge-pill svg{width:13px;height:13px;color:var(--accent2)}
.price-note{font-size:11.5px;color:var(--muted);text-align:center;margin-top:14px;line-height:1.5}

/* ── GUARANTEE ── */
.guarantee{display:flex;gap:24px;align-items:center;background:rgba(13,24,26,.6);border:1px solid rgba(74,154,173,.3);
  border-radius:var(--r);padding:34px 38px}
.guarantee .gic{width:62px;height:62px;flex:0 0 auto;border-radius:50%;background:rgba(74,154,173,.12);
  border:1px solid rgba(74,154,173,.4);display:flex;align-items:center;justify-content:center;color:var(--accent2)}
.guarantee .gic svg{width:30px;height:30px}
.guarantee h3{margin-bottom:6px}
.guarantee p{font-size:14.5px;color:var(--sub);font-weight:300;line-height:1.55}

/* ── TRUST badges row ── */
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.trust-item{text-align:center;padding:26px 14px;background:rgba(13,24,26,.5);border:1px solid var(--border);border-radius:var(--r)}
.trust-item .ic{width:52px;height:52px;border-radius:14px;background:rgba(74,154,173,.12);border:1px solid rgba(74,154,173,.35);
  display:inline-flex;align-items:center;justify-content:center;color:var(--accent2);margin-bottom:14px}
.trust-item .ic svg{width:24px;height:24px}
.trust-item h4{font-size:14.5px;color:var(--white);font-weight:700;margin-bottom:6px}
.trust-item p{font-size:13px;color:var(--sub);font-weight:300;line-height:1.5}

/* ── CALLOUT ── */
.callout{background:linear-gradient(135deg,var(--teal),var(--dark2));border-radius:18px;padding:64px 48px;text-align:center;
  border:1px solid rgba(74,154,173,.3)}
.callout .h2{margin-bottom:14px}
.callout .lead{margin:0 auto 28px}

/* ── NEXT STEP (cross-links, abajo, nueva pestaña) ── */
.nextstep{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;max-width:880px;margin:0 auto}
.ns-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:26px 28px;border:1px solid var(--border);
  border-radius:var(--r);background:rgba(13,24,26,.55);transition:border-color .25s,transform .25s,background .25s}
.ns-card:hover{border-color:rgba(74,154,173,.55);transform:translateY(-3px);background:rgba(13,24,26,.9)}
.ns-card .ns-k{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--accent2);font-weight:700;margin-bottom:6px}
.ns-card h4{font-size:17px;color:var(--white);font-weight:700;line-height:1.2}
.ns-card .ns-ar{width:38px;height:38px;flex:0 0 auto;border-radius:50%;border:1px solid var(--border);display:flex;
  align-items:center;justify-content:center;color:var(--accent2);transition:.25s}
.ns-card:hover .ns-ar{background:var(--accent);color:#04181d;border-color:var(--accent)}
.ns-card .ns-ar svg{width:16px;height:16px}

/* ── FOOTER ── */
footer{background:#030507;padding:62px 40px 34px;border-top:1px solid var(--border)}
.foot-inner{max-width:1280px;margin:0 auto}
.foot-top{display:grid;grid-template-columns:2.4fr 1fr 1fr 1.2fr;gap:46px;margin-bottom:44px}
.foot-brand img{height:21px;margin-bottom:15px}
.foot-brand p{font-size:13px;color:var(--muted);line-height:1.75;max-width:280px;font-weight:300}
.foot-col h4{font-size:9px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:rgba(246,247,242,.35);margin-bottom:18px}
.foot-col a,.foot-col span{display:block;font-size:13px;color:var(--muted);margin-bottom:10px;transition:color .2s;font-weight:300}
.foot-col a:hover{color:var(--cream)}
.foot-bottom{border-top:1px solid var(--border);padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
.foot-bottom p{font-size:11px;color:var(--muted)}

/* ── RESPONSIVE ── */
@media(max-width:980px){
  .wrap{padding:0 22px}
  .lp-hero-split{grid-template-columns:1fr;gap:36px}
  .lp-hero-art{max-width:440px}
  .g3,.g4,.steps,.trust,.stats{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr;gap:30px}.split.rev .split-media{order:0}
  .nextstep{grid-template-columns:1fr}
  .foot-top{grid-template-columns:1fr 1fr;gap:28px}
}
@media(max-width:600px){
  section{padding:68px 0}
  .g2,.g3,.g4,.steps,.trust,.stats{grid-template-columns:1fr}
  .cmp-row,.cmp-row.head{grid-template-columns:1.1fr 1fr 1.1fr}
  .cmp .a,.cmp .b,.cmp .v{padding:14px 12px;font-size:12.5px}
  .price-card{padding:14px 24px 30px}.price-ribbon{margin:-14px -24px 20px}
  .guarantee{flex-direction:column;text-align:center;padding:30px 24px}
  .foot-top{grid-template-columns:1fr}
  .hero-actions{flex-direction:column;align-items:stretch}
}

/* ===== Batch fixes mobile (comentarios v3) ===== */
.steps--5{grid-template-columns:repeat(5,1fr)}
.hero-actions{flex-wrap:wrap}
.guar-img{flex:0 0 54%;width:54%;max-width:680px;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:18px;border:1px solid rgba(74,154,173,.3)}
@media(min-width:981px){.steps--5 .step:not(:last-child)::after{top:52px}}
@media(max-width:760px){
  /* #10 tabla comparativa -> tarjetas apiladas, todo visible sin scroll lateral */
  .vtable-scroll{overflow-x:visible}
  .vtable{min-width:0;border-collapse:separate;border-spacing:0}
  .vtable thead{display:none}
  .vtable, .vtable tbody, .vtable tr, .vtable td{display:block;width:100%}
  .vtable tr{border:1px solid rgba(74,154,173,.28);border-radius:12px;margin-bottom:14px;overflow:hidden;background:rgba(16,30,34,.94)}
  .vtable td{display:flex;justify-content:space-between;align-items:center;gap:12px;text-align:right;padding:11px 14px;border-bottom:1px solid rgba(74,154,173,.12);font-size:13.5px}
  .vtable td::before{content:attr(data-label);text-align:left;color:var(--accent2);font-weight:600;font-size:11.5px;letter-spacing:.3px;flex:0 0 46%}
  .vtable td.rowhead{justify-content:center;background:rgba(74,154,173,.18);color:#fff;font-size:12.5px;letter-spacing:1.2px;text-transform:uppercase}
  .vtable td.rowhead::before{display:none}
  .vtable td.col-v{background:rgba(74,154,173,.12)}
  .vtable tbody tr.strip td.col-v{background:var(--accent);color:#04181d}
  .vtable td svg{width:16px;height:16px}
}
@media(max-width:600px){
  /* #17 pasos (5) apilan legibles */
  .steps--5{grid-template-columns:1fr !important}
  /* #18 no-brainer: atributo full-width + Veltric vs Comprar lado a lado, sin transbordar */
  .cmp-row,.cmp-row.head{grid-template-columns:1fr 1fr !important}
  .cmp .a{grid-column:1 / -1;justify-content:center;text-align:center}
  .cmp-row.head .a{display:none}
  .cmp .a,.cmp .b,.cmp .v{padding:12px 13px;font-size:12.5px}
  .cmp-row.head>*{padding:11px 13px;font-size:10px}
  .cmp .v{border-left:0}
  /* #20 botones del callout no se salen del recuadro */
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-actions .btn{width:100%;text-align:center}
  /* #19 imagen cero riesgo full-width en mobile */
  .guar-img{flex:0 0 auto;width:100%;max-width:none}
}

/* #8 pasos se marcan en verde al scrollear */
.steps .step{transition:border-color .5s,background .5s,box-shadow .5s}
.steps .step:not(.step-result).step-lit{border-color:rgba(91,191,154,.6);background:rgba(91,191,154,.09);box-shadow:0 10px 28px rgba(91,191,154,.14)}
.steps .step.step-lit .sn:not([style]){background:#5bbf9a;box-shadow:0 6px 16px rgba(91,191,154,.4)}
/* #11 cuadros se ponen dorados (confianza) al scrollear */
.trust-gold .trust-item{transition:border-color .6s,background .6s,box-shadow .6s}
.trust-gold .trust-item.gold-on{border-color:rgba(216,182,119,.6);background:rgba(216,182,119,.08);box-shadow:0 12px 32px rgba(216,182,119,.15)}
.trust-gold .trust-item.gold-on .ic{border-color:rgba(216,182,119,.6)!important;color:#d8b677!important;background:rgba(216,182,119,.16)!important}

/* #3 ocultar videos en mobile (espacios cómo funciona) */
@media(max-width:600px){.hide-mobile{display:none}}
/* #4 cruces rojas + características que no sirven en rojo */
.vtable .no{color:#e8836f}
.vtable td.bad{color:#e8836f}
.vtable td.bad .no{color:#e8836f}