:root{
  --paper:#f4f8fd; --paper-2:#eaf2fb; --card:#fff; --ink:#0d1b2a; --ink-2:#33465b; --mut:#5a6b82;
  --slate:#5c7186; --slate-3:#8598ac; --line:#e2eaf3; --line-2:#eef4fb;
  --azure:#1565d8; --azure-deep:#0d47a1; --azure-lt:#2c8be0; --emerald:#2e9e5a; --emerald-br:#37b06a;
  --gold:#b8801f; --gold-lt:#e0a62c; --warn:#d98a12; --danger:#e5544e; --ok:#1fa565;
  --grad:linear-gradient(120deg,#0d47a1,#1565d8 55%,#2c8be0); --grad-soft:linear-gradient(120deg,rgba(13,71,161,.10),rgba(44,139,224,.13));
  --f-disp:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif; --f-body:'Inter','Segoe UI',system-ui,sans-serif; --f-mono:'IBM Plex Mono',ui-monospace,'Cascadia Code',monospace;
  --wrap:1200px; --r:15px; --r-lg:20px; --sh:0 12px 34px -18px rgba(10,60,120,.28); --sh-lift:0 24px 60px -26px rgba(10,60,120,.4);
  --accent:#1fa8c9; --navy-900:#0a1a2b; --navy-950:#071019;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--f-disp);font-weight:700;line-height:1.06;letter-spacing:-.02em;text-wrap:balance;margin:0}
p{margin:0} a{color:inherit;text-decoration:none} img{max-width:100%}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px;position:relative;z-index:2}
.eyebrow{font-family:var(--f-mono);font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--azure-deep);font-weight:500}
.h2{font-size:clamp(28px,3.6vw,44px);color:var(--ink)}
.lede{margin:14px auto 0;font-size:18px;color:var(--slate);max-width:640px}
.center{text-align:center;max-width:760px;margin:0 auto}
.pad{padding:88px 0} section{position:relative}
.tintband{background:linear-gradient(180deg,#fff,#eef5fd)}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s,transform .7s cubic-bezier(.2,.7,.2,1)}.reveal.in{opacity:1;transform:none}
svg.ic{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
svg.ic .au{stroke:#d99a1e}
.btn{display:inline-flex;align-items:center;gap:.5em;font-family:var(--f-disp);font-weight:600;font-size:15px;padding:.85em 1.4em;border-radius:999px;border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:transform .18s,box-shadow .25s}
.btn:focus-visible{outline:3px solid var(--azure);outline-offset:2px}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 14px 30px -12px rgba(44,139,224,.6)}
.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost{background:#fff;color:var(--ink);border-color:var(--line)}.btn-ghost:hover{border-color:#b9cbe4}
.btn-dark{background:var(--ink);color:#fff}.btn-dark:hover{transform:translateY(-2px);box-shadow:var(--sh-lift)}
.btn-lg{padding:.95em 1.6em;font-size:16px}

/* STAGE / TAPE / NAV / HERO */
.stage{position:relative;overflow:hidden;background:radial-gradient(85% 75% at 84% 6%,rgba(44,139,224,.15),transparent 55%),linear-gradient(160deg,#f6faff,#eaf2fb 55%,#f2f7fd)}
.stage::before{content:"";position:absolute;inset:0;opacity:.6;pointer-events:none;background-image:linear-gradient(rgba(21,101,216,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(21,101,216,.045) 1px,transparent 1px);background-size:52px 52px;mask-image:radial-gradient(120% 90% at 50% 0%,#000,transparent 78%)}
/* (#px eliminado: el mapa 3D del mercado reemplazó la red decorativa del hero) */
.tape{position:relative;z-index:3;border-bottom:1px solid var(--line);background:rgba(255,255,255,.78);display:flex;align-items:center}
.tape__lab{flex:none;display:flex;align-items:center;gap:7px;font-family:var(--f-mono);font-size:11px;letter-spacing:.03em;color:var(--azure-deep);padding:9px 15px;border-right:1px solid var(--line);white-space:nowrap;text-transform:uppercase}
.tape__lab .d{width:6px;height:6px;border-radius:50%;background:var(--ok);animation:pulse 1.8s infinite}
.tape__vp{overflow:hidden;flex:1}
.tape__track{display:inline-flex;gap:30px;padding:9px 18px;white-space:nowrap;animation:slide 46s linear infinite;font-family:var(--f-mono);font-size:12.5px;font-variant-numeric:tabular-nums}
.tk{display:inline-flex;align-items:center;gap:8px;color:var(--mut);text-decoration:none;cursor:pointer}.tk b{color:var(--ink);font-weight:600}
.tk .up{color:var(--ok)}.tk .dn{color:var(--danger)}.tk .dot{width:5px;height:5px;border-radius:50%;background:var(--azure)}
.tape a.tk:hover b{text-decoration:underline;text-underline-offset:2px}.tape a.tk:hover{color:var(--ink-2)}
@keyframes slide{to{transform:translateX(-50%)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(31,165,101,.5)}70%{box-shadow:0 0 0 8px rgba(31,165,101,0)}100%{box-shadow:0 0 0 0 rgba(31,165,101,0)}}
.lnav{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;padding:16px 0}
.brand img{height:38px;width:auto;display:block}
.lnav__links{display:flex;gap:26px;font-size:14.5px}.lnav__links a{color:var(--mut)}.lnav__links a:hover{color:var(--azure-deep)}
.lnav__cta{display:flex;gap:12px;align-items:center}
.lnav__login{color:var(--ink-2);font-weight:500;font-size:14.5px}.lnav__login:hover{color:var(--azure-deep)}
@media(max-width:860px){.lnav__links{display:none}}
.hero2{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:start;padding:40px 0 66px}
.eyebrow2{display:inline-flex;align-items:center;gap:9px;font-family:var(--f-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--azure-deep);border:1px solid var(--line);border-radius:999px;padding:6px 13px;background:rgba(44,139,224,.06)}
.eyebrow2 .live{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:pulse 1.8s infinite}
.hero2 h1{font-size:clamp(35px,5vw,58px);margin-top:20px;color:var(--ink)}
.hero2 h1 .g{background:linear-gradient(100deg,#a9760f,var(--gold-lt));-webkit-background-clip:text;background-clip:text;color:transparent}
.sub2{margin-top:20px;font-size:18px;color:var(--ink-2);max-width:520px}.sub2 b{color:var(--ink);font-weight:600}
.actions2{display:flex;gap:13px;margin-top:28px;flex-wrap:wrap}
.micro2{margin-top:15px;font-family:var(--f-mono);font-size:12.5px;color:#7a8ca6}
.chips2{display:flex;gap:22px;margin-top:32px;flex-wrap:wrap}
.c2 .n{font-family:var(--f-disp);font-weight:700;font-size:25px;font-variant-numeric:tabular-nums;background:linear-gradient(110deg,var(--azure-deep),var(--azure-lt));-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}
.c2 .l{font-size:12px;color:var(--mut);margin-top:4px;max-width:130px}
/* Terminal */
.term{position:relative;border-radius:20px;padding:18px;background:linear-gradient(180deg,#fff,#f7fbff);border:1px solid var(--line);box-shadow:0 30px 70px -34px rgba(13,71,161,.35);animation:breathe 6s ease-in-out infinite}
@keyframes breathe{0%,100%{box-shadow:0 30px 70px -34px rgba(13,71,161,.32),0 0 0 0 rgba(44,139,224,0)}50%{box-shadow:0 34px 76px -30px rgba(13,71,161,.34),0 0 40px -8px rgba(44,139,224,.4)}}
.term::after{content:"";position:absolute;inset:0;border-radius:20px;pointer-events:none;background:linear-gradient(115deg,transparent 42%,rgba(44,139,224,.1) 50%,transparent 58%);background-size:250% 100%;animation:scan 5.5s ease-in-out infinite}
@keyframes scan{0%,100%{background-position:180% 0}50%{background-position:-80% 0}}
.term__h{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}
.term__t{font-family:var(--f-mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--azure-deep)}
.term__live{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:10.5px;color:var(--ok)}.term__live b{width:6px;height:6px;border-radius:50%;background:var(--ok);animation:pulse 1.8s infinite}
.tcard{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:14px}
.oppo2{display:flex;gap:14px;align-items:center}
.ring2s{width:72px;height:72px;flex:none}.ring2s .trk{fill:none;stroke:#e2ebf6;stroke-width:8}
.ring2s .arc{fill:none;stroke:url(#rg);stroke-width:8;stroke-linecap:round;stroke-dasharray:283;stroke-dashoffset:283;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dashoffset 1.4s cubic-bezier(.2,.7,.3,1)}
.ring2s text{font-family:var(--f-disp);font-weight:700;font-size:23px;fill:var(--ink)}
.oppo2 h4{font-size:15px;margin-bottom:4px}.oppo2 .meta{font-size:12.5px;color:var(--mut);font-family:var(--f-mono)}
.tgs{display:flex;gap:7px;margin-top:9px}.tg{font-family:var(--f-mono);font-size:10.5px;padding:3px 8px;border-radius:999px;background:rgba(31,165,101,.12);color:var(--ok);border:1px solid rgba(31,165,101,.28)}.tg.w{background:rgba(217,138,18,.13);color:var(--warn);border-color:rgba(217,138,18,.3)}
.lab{font-family:var(--f-mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--mut);margin:15px 0 9px}
.bars{display:flex;flex-direction:column;gap:9px}
.bar{display:grid;grid-template-columns:92px 1fr auto;align-items:center;gap:10px;font-size:12px}
.bar .nm{color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar .trk{height:8px;border-radius:99px;background:#e6eef8;overflow:hidden}.bar .fl{height:100%;border-radius:99px;width:0;background:linear-gradient(90deg,var(--azure-deep),var(--azure-lt));transition:width 1.3s cubic-bezier(.2,.7,.3,1)}
.bar.me .fl{background:linear-gradient(90deg,#a9760f,var(--gold-lt))}.bar .v{font-family:var(--f-mono);font-size:11px;color:var(--mut)}
.bar.lead .fl{animation:shine 2.6s ease-in-out infinite}@keyframes shine{0%,100%{filter:brightness(1)}50%{filter:brightness(1.18) saturate(1.2)}}
.prow2{display:flex;justify-content:space-between;padding:5px 0}.prow2 .v{font-family:var(--f-mono)}
.prow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--line-2);font-size:13px;color:var(--ink-2)}.prow:last-child{border:0}.prow .v{font-family:var(--f-mono);font-size:12px;color:var(--ink)}

/* ESCALA */
.escala{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:44px}
.en{font-family:var(--f-mono);font-weight:600;font-size:clamp(24px,2.6vw,34px);letter-spacing:-.01em;font-variant-numeric:tabular-nums;line-height:1;background:linear-gradient(110deg,var(--azure-deep),var(--azure-lt));-webkit-background-clip:text;background-clip:text;color:transparent}
.el{color:var(--mut);font-size:13px;margin-top:8px}

/* FEATURE ROWS */
.frow2{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;padding:44px 0}
.k2{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--azure-deep);font-weight:500}
.k2::before{content:"";width:7px;height:7px;flex:none;border-radius:50%;background:var(--ok);animation:pulse 1.8s infinite}
.k2 .ki{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:rgba(21,101,216,.1);color:var(--azure)}.k2 .ki svg{width:15px;height:15px}
.frow2 h3{font-size:27px;margin:14px 0 0;color:var(--ink)}
.frow2 .d{margin-top:12px;color:var(--ink-2);font-size:16.5px}
.flist2{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
.flist2 li{display:flex;gap:9px;align-items:flex-start;font-size:15px;color:var(--ink-2)}
.flist2 .ci{width:20px;height:20px;flex:none;color:var(--ok);margin-top:1px}.flist2 .ci svg{width:20px;height:20px;stroke-width:2.4}
.fmedia2{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 24px 54px -34px rgba(13,71,161,.3);position:relative;overflow:hidden}
/* Feature con imagen (poster): marco premium con sombra + glow de marca + flotación al hover */
.fmedia2--img{background:none;border:0;padding:0;box-shadow:none;overflow:visible}
.fmedia2__img{display:block;width:100%;height:auto;border-radius:22px;border:1px solid var(--line);box-shadow:0 34px 70px -28px rgba(13,71,161,.42),0 8px 24px -14px rgba(13,71,161,.22);transition:transform .45s cubic-bezier(.2,.9,.25,1),box-shadow .45s;will-change:transform}
.fmedia2--img:hover .fmedia2__img{transform:translateY(-7px) scale(1.012);box-shadow:0 46px 92px -28px rgba(13,71,161,.5),0 10px 28px -14px rgba(13,71,161,.28)}
.fmedia2--img::before{content:"";position:absolute;inset:6% 6% 2%;z-index:-1;border-radius:30px;background:radial-gradient(60% 60% at 45% 40%,rgba(21,101,216,.2),transparent 70%),radial-gradient(55% 55% at 75% 85%,rgba(46,158,90,.16),transparent 72%);filter:blur(34px);opacity:.85}
.cal{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:12px}
.cal .m{border:1px solid var(--line);border-radius:9px;padding:8px 4px;text-align:center;font-size:10px;color:var(--mut)}
.cal .m b{display:block;font-family:var(--f-disp);font-size:13px;color:var(--ink);margin-top:2px}
.cal .m.hot{background:linear-gradient(160deg,#0d47a1,#2c8be0);color:#fff;border-color:transparent}.cal .m.hot b{color:#fff}.cal .m.warm{background:#dcecfb}
.khero{background:linear-gradient(135deg,#082f57,#0a4a86);border-radius:12px;padding:13px 14px;color:#fff}
.khero .kk{font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#9fc6ee}.khero .kv{font-family:var(--f-disp);font-weight:700;font-size:24px;margin-top:4px}
.ship{display:flex;gap:8px;margin-top:12px}.chipx{flex:1;border:1px solid var(--line);border-radius:10px;padding:9px;text-align:center;font-size:12px;color:var(--ink-2)}.chipx b{display:block;font-family:var(--f-disp);font-size:15px;color:var(--ink)}
.grow{display:flex;align-items:center;gap:11px;background:#eafaf0;border:1px solid #bfe8cf;border-radius:12px;padding:12px 13px;margin-top:12px}
.grow .gi{width:34px;height:34px;border-radius:9px;background:var(--ok);color:#fff;display:grid;place-items:center;flex:none}.grow .gi svg{width:19px;height:19px;stroke-width:2.5}
.grow .gt{font-weight:700;color:#177a48;font-size:14px}.grow .gs{font-size:12px;color:#3f7a55;margin-top:1px}

/* COVERFLOW (ventana Windows) */
.cf{display:flex;gap:16px;overflow:hidden;padding:10px 0 4px;justify-content:center;align-items:center;margin-top:36px}
.cfi{width:230px;flex:none;border-radius:14px;overflow:hidden;border:1px solid var(--line);box-shadow:0 20px 46px -26px rgba(13,71,161,.4);transition:transform .5s,opacity .5s;background:#fff}
.cfi:not(.on){opacity:.5;transform:scale(.86)}.cfi.on{transform:scale(1.06);box-shadow:0 28px 60px -22px rgba(13,71,161,.5)}
.mock{background:#fff}
.mbar{height:27px;background:#f2f5fa;display:flex;align-items:center;padding:0 9px 0 12px;border-bottom:1px solid var(--line);gap:10px}
.mbar::before{content:"mercadopublico.cl";font-family:var(--f-mono);font-size:9px;letter-spacing:.02em;color:#93a6bd;margin-right:auto}
.mbar i{display:block;opacity:.62}
.mbar i:nth-child(1){width:8px;height:7px;border-bottom:1.5px solid #7f93ab}
.mbar i:nth-child(2){width:8px;height:8px;border:1.4px solid #7f93ab;border-radius:1px}
.mbar i:nth-child(3){position:relative;width:10px;height:10px}
.mbar i:nth-child(3)::before,.mbar i:nth-child(3)::after{content:"";position:absolute;top:4.2px;left:0;width:10px;height:1.4px;background:#7f93ab}
.mbar i:nth-child(3)::before{transform:rotate(45deg)}.mbar i:nth-child(3)::after{transform:rotate(-45deg)}
.mbody{padding:16px;min-height:174px}.mtag{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--azure-deep);margin-bottom:12px}
.mring{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-disp);font-weight:700;font-size:17px;color:var(--ink);background:conic-gradient(var(--azure) 0 78%,#e6eef8 78%);position:relative}.mring::before{content:"";position:absolute;inset:6px;background:#fff;border-radius:50%}.mring b{position:relative;z-index:2}
.msem{font-family:var(--f-disp);font-weight:700;color:var(--ok);font-size:15px}
.mbig{font-family:var(--f-disp);font-weight:700;font-size:22px;background:linear-gradient(110deg,#a9760f,var(--gold-lt));-webkit-background-clip:text;background-clip:text;color:transparent}
.mline{height:9px;border-radius:5px;background:#eaf0f8;margin-top:12px}.mline.s{width:65%}
.mkpi{font-family:var(--f-mono);font-size:12px;color:var(--mut);margin-top:12px}.mchk{margin-top:12px;font-size:12px;color:var(--ok);font-weight:600}

/* BOARD · panel de sistema (readout) */
.board{margin-top:44px;border:1px solid rgba(120,170,220,.16);border-radius:16px;overflow:hidden;background:linear-gradient(180deg,#0c1f38,#0a1a2e);color:#dce7f5;box-shadow:0 34px 78px -42px rgba(13,71,161,.55)}
.board__head{display:flex;align-items:center;gap:12px;padding:13px 18px;border-bottom:1px solid rgba(120,170,220,.16);background:rgba(255,255,255,.02);font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.board__sys{display:inline-flex;align-items:center;gap:7px;color:#6fcbe8;font-weight:600}
.board__sys .live{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:pulse 1.8s infinite}
.board__title{color:#eaf3fb;letter-spacing:.1em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.board__meta{margin-left:auto;color:#8fb4d4;white-space:nowrap}
.board__grid{display:grid;grid-template-columns:1fr 1fr}
.board__row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;padding:14px 18px;border-bottom:1px solid rgba(120,170,220,.1);border-right:1px solid rgba(120,170,220,.1)}
.board__row:nth-child(2n){border-right:0}
.board__row:nth-last-child(1),.board__row:nth-last-child(2){border-bottom:0}
.board__ico{width:30px;height:30px;flex:none;border-radius:8px;display:grid;place-items:center;color:#6fb6f0;background:rgba(21,101,216,.16);border:1px solid rgba(120,170,220,.2)}.board__ico svg{width:16px;height:16px}.board__ico svg.ic .au{stroke:var(--gold-lt)}
.board__body{min-width:0}
.board__lab{display:block;font-family:var(--f-mono);font-size:11.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:#eaf3fb;font-variant-numeric:tabular-nums}
.board__desc{display:block;font-size:12.5px;line-height:1.42;color:#a9bed3;margin-top:3px}
.board__stat{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--emerald-br);white-space:nowrap}
.board__stat::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--emerald-br);box-shadow:0 0 7px rgba(55,176,106,.7)}

/* SEGURIDAD */
.sec{background:linear-gradient(180deg,#0a1a2b,#071019);color:#eaf3fb}
.sec .h2{color:#fff}.sec .lede{color:#a9bed3}.sec .eyebrow{color:#6fcbe8}
.seals{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:40px}
.seal{width:206px;border-radius:16px;padding:22px 16px;text-align:center;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid rgba(120,170,220,.2);transition:transform .2s,border-color .2s}
.seal:hover{transform:translateY(-5px);border-color:var(--azure)}
.seal .badge{width:56px;height:56px;margin:0 auto 12px;border-radius:14px;display:grid;place-items:center;background:var(--grad);box-shadow:0 12px 28px -10px rgba(44,139,224,.6)}
.seal .t{font-family:var(--f-disp);font-weight:600;font-size:16px;color:#fff}.seal .s{font-family:var(--f-mono);font-size:11px;color:#8fb4d4;margin-top:4px;letter-spacing:.04em}
.seal .why{font-family:var(--f-body);font-size:12.5px;line-height:1.45;color:#c2d8ee;margin-top:13px;padding-top:13px;border-top:1px solid rgba(120,170,220,.18)}

/* FINAL */
.final{background:var(--grad);color:#fff;text-align:center}
.final h2{font-size:clamp(28px,3.8vw,44px);color:#fff}.final p{max-width:600px;margin:14px auto 24px;color:rgba(255,255,255,.92)}
.final .btn-dark{background:#fff;color:var(--azure-deep)}

/* PLANES (preservado, oscuro) */
.band-dark{background:linear-gradient(180deg,var(--navy-900),var(--navy-950));color:#eaf3fb}
.band-dark .h2{color:#fff}.band-dark .lede{color:#a9bed3}.band-dark .eyebrow{color:#12a0e8}
.pricing{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;align-items:stretch;margin-top:48px}
.plan{position:relative;background:rgba(255,255,255,.04);border:1px solid rgba(120,170,220,.16);border-radius:var(--r-lg);padding:26px 22px;display:flex;flex-direction:column}
.plan--accent{border-color:rgba(18,160,232,.4);box-shadow:0 10px 30px -14px rgba(18,160,232,.35)}
.plan--pop{border:1.5px solid var(--azure);background:linear-gradient(180deg,#0f2438,#0b1b2c);box-shadow:var(--sh-lift)}
@media(min-width:1001px){.plan--pop{transform:translateY(-10px)}}
.plan__badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);font-size:11px;font-weight:600;padding:5px 13px;border-radius:999px;white-space:nowrap;font-family:var(--f-disp)}
.plan__badge--accent{background:rgba(18,160,232,.16);color:#8fd0f5;border:1px solid rgba(18,160,232,.35)}.plan__badge--pop{background:var(--grad);color:#fff}
.plan__name{font-family:var(--f-disp);font-weight:600;font-size:17px;margin:4px 0 2px;color:#fff}
.plan__tag{font-size:12px;color:#93a8bd;min-height:32px}
.plan__price{font-family:var(--f-disp);font-weight:700;font-size:clamp(24px,3vw,32px);letter-spacing:-.02em;margin:10px 0 0;color:#fff}
.plan__per{font-size:13px;font-weight:400;color:#93a8bd;font-family:var(--f-body)}
/* Precio en pausa. Lo difuminado es un relleno decorativo: la cifra real no se
   emite (ver Landing.cshtml). El sello va encima, nítido, y es el único texto
   que anuncia un lector de pantalla. */
.plan__price--velado{position:relative;margin:10px 0 0}
.plan__price-ph{display:block;font-family:var(--f-disp);font-weight:700;font-size:clamp(24px,3vw,32px);letter-spacing:-.02em;line-height:1.18;color:rgba(240,248,255,.92);filter:blur(5.5px);user-select:none;pointer-events:none}
.plan__price-ph .plan__per{color:rgba(190,212,235,.85)}
.plan__price-seal{position:relative;z-index:1;display:block;margin-top:-11px;font-family:var(--f-mono);font-size:10px;line-height:1.45;letter-spacing:.08em;text-transform:uppercase;color:#9ed3f2;text-shadow:0 1px 7px rgba(8,22,40,.95),0 0 14px rgba(8,22,40,.8)}
.plan__price-seal::before{content:"";display:inline-block;width:5px;height:5px;margin-right:7px;border-radius:50%;background:var(--gold-lt);box-shadow:0 0 8px rgba(224,166,44,.75);vertical-align:middle}
.plan__feats{list-style:none;padding:0;margin:16px 0 18px;display:flex;flex-direction:column;gap:9px;flex:1}
.plan__feats li{font-size:12.5px;color:#cfe0f0;padding-left:20px;position:relative;line-height:1.4}
.plan__feats li::before{content:'\2713';position:absolute;left:0;color:var(--emerald-br);font-weight:700}
.plan__feats li.off{color:#7488a0;opacity:.7}.plan__feats li.off::before{content:'\2013';color:#7488a0}
.plan__cta{justify-content:center;width:100%}
.band-dark .btn-ghost{background:rgba(255,255,255,.06);color:#eaf3fb;border-color:rgba(255,255,255,.18)}.band-dark .btn-ghost:hover{background:rgba(255,255,255,.12)}

/* FOOTER */
footer{background:#fff;color:var(--slate);padding:44px 0;font-size:14px;border-top:1px solid var(--line)}
.foot-in{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;max-width:var(--wrap);margin:0 auto;padding:0 24px}
.foot-links{display:flex;flex-wrap:wrap;gap:22px}.foot-links a:hover{color:var(--azure-deep)}
.foot__sponsor-row{max-width:var(--wrap);margin:22px auto 0;padding:22px 24px 0;border-top:1px solid var(--line);text-align:center}
.foot__sponsor{display:inline-flex;align-items:center;gap:11px;color:var(--slate);font-size:12.5px}.foot__sponsor:hover{color:var(--azure-deep)}
.foot__sponsor img{height:30px;width:auto;background:#fff;padding:5px 9px;border-radius:7px;border:1px solid var(--line)}

/* GATE (preservado) */
.devgate{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:24px}
.devgate__veil{position:absolute;inset:0;background:rgba(8,17,34,.55);backdrop-filter:blur(9px) saturate(1.1);-webkit-backdrop-filter:blur(9px) saturate(1.1)}
.devgate__card{position:relative;max-width:460px;width:100%;text-align:center;padding:36px 32px 30px;border-radius:22px;background:#fff;border:1px solid #e5edf7;box-shadow:0 40px 90px -34px rgba(13,45,90,.45),0 6px 20px -12px rgba(13,45,90,.22);color:#0d1b2a;overflow:hidden;animation:dgin .7s cubic-bezier(.22,1,.36,1) both}
.devgate__glow{position:absolute;inset:-2px;border-radius:22px;padding:1.5px;background:conic-gradient(from var(--dg-ang,0deg),transparent 0deg,rgba(21,101,216,.75) 90deg,transparent 180deg,rgba(46,158,90,.65) 300deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:dgspin 6s linear infinite;pointer-events:none}
.devgate__badge{position:relative;display:inline-flex;align-items:center;gap:8px;padding:6px 13px;border:1px solid rgba(21,101,216,.26);border-radius:999px;background:rgba(21,101,216,.07);color:#1565d8;font-size:11.5px;font-family:var(--f-mono);letter-spacing:.08em;text-transform:uppercase;margin-bottom:18px}
.devgate__dot{width:7px;height:7px;border-radius:50%;background:#2e9e5a;box-shadow:0 0 8px #34d399;animation:dgpulse 1.8s ease-in-out infinite}
.devgate__title{font-family:var(--f-disp);font-weight:700;font-size:clamp(24px,4.5vw,30px);line-height:1.12;letter-spacing:-.02em;margin:0 0 12px;background:linear-gradient(100deg,#0d47a1,#1565d8 52%,#2e9e5a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.devgate__sub{color:#43566d;font-size:14.5px;line-height:1.6;margin:0 auto 22px;max-width:380px}
.devgate__login{display:inline-block;margin-top:18px;font-size:12.5px;color:#7286a0}.devgate__login:hover{color:#1565d8}
@property --dg-ang{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes dgspin{to{--dg-ang:360deg}}@keyframes dgshine{to{background-position:200% center}}
@keyframes dgpulse{0%,100%{box-shadow:0 0 0 0 rgba(46,158,90,.5)}50%{box-shadow:0 0 0 6px rgba(46,158,90,0)}}
@keyframes dgin{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.wl-form{margin:0 auto;max-width:380px}.wl-row{display:flex;gap:8px}
.wl-input{flex:1;height:48px;border-radius:12px;border:1px solid #d3e0f0;background:#f5f9fe;color:#0d1b2a;padding:0 14px;font-size:14px;font-family:var(--f-body);outline:none;transition:border-color .15s,background .15s,box-shadow .15s}
.wl-input:focus{border-color:#1565d8;background:#fff;box-shadow:0 0 0 3px rgba(21,101,216,.13)}.wl-input::placeholder{color:#7286a0}.wl-input:disabled{opacity:.6}
.wl-btn{display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 20px;border:0;border-radius:12px;background:linear-gradient(152deg,#0d47a1,#1565d8 46%,#2e9e5a);color:#fff;font-weight:600;font-size:14px;font-family:var(--f-body);cursor:pointer;white-space:nowrap;transition:transform .15s,box-shadow .2s;box-shadow:0 14px 30px -12px rgba(21,101,216,.55)}
.wl-btn:hover{transform:translateY(-1px);box-shadow:0 18px 36px -12px rgba(21,101,216,.62)}.wl-btn__spin{display:none;animation:wlspin 1s linear infinite}
.wl-form.is-loading .wl-btn__label{opacity:.5}.wl-form.is-loading .wl-btn__spin{display:inline-block}.wl-form.is-done .wl-btn{background:#2e9e5a;box-shadow:none}
.wl-status{min-height:18px;margin:10px 0 0;font-size:12.5px}.wl-status--ok{color:#1a7a44}.wl-status--err{color:#b42318}
@keyframes wlspin{to{transform:rotate(360deg)}}

/* ── Botones de tienda (extensión + apps) ── */
.stores{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:26px}
.apps__copy .stores{justify-content:flex-start;margin-top:22px}
.store{display:flex;align-items:center;gap:12px;padding:9px 17px 9px 13px;background:var(--card);border:1px solid var(--line);border-radius:13px;box-shadow:var(--sh);min-width:196px;text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s,border-color .2s}
.store:hover{transform:translateY(-2px);box-shadow:var(--sh-lift);border-color:var(--azure-lt)}
.store__ico{width:38px;height:38px;flex:none;display:grid;place-items:center;background:var(--paper);border-radius:10px}
.store__tx{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.store__tx small{font-size:10px;color:var(--slate);text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.store__tx b{font:600 16px/1.15 var(--f-disp);color:var(--ink)}
.store__badge{margin-left:auto;font:700 10px/1 var(--f-body);letter-spacing:.04em;text-transform:uppercase;color:#0b6b3a;background:#e5f6ec;border:1px solid #bfe8cf;padding:5px 9px;border-radius:999px;white-space:nowrap}
.store-note{margin-top:16px;font-size:13px;color:var(--slate)}
.store-note a{color:var(--azure);font-weight:600;text-decoration:none;border-bottom:1px solid rgba(21,101,216,.3)}

/* ── Sección apps móvil ── */
.apps__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.apps__list{list-style:none;padding:0;margin:18px 0 4px;display:flex;flex-direction:column;gap:11px}
.apps__list li{display:flex;align-items:center;gap:11px;font-size:15px;color:var(--ink-2)}
.apps__list .ci{width:22px;height:22px;flex:none;display:grid;place-items:center;background:#e5f6ec;border-radius:7px}
.apps__list .ci .ic{width:14px;height:14px;stroke:var(--emerald);fill:none;stroke-width:2.4}
.apps__phone{display:grid;place-items:center}
.phone{width:270px;background:#0d1b2a;border-radius:34px;padding:12px;box-shadow:var(--sh-lift);position:relative}
.phone__note{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:108px;height:20px;background:#0d1b2a;border-radius:0 0 14px 14px;z-index:2}
.phone__scr{background:radial-gradient(120% 80% at 50% 0%,#fff,var(--paper) 62%,var(--paper-2));border-radius:24px;padding:28px 16px 16px;min-height:468px;display:flex;flex-direction:column;gap:10px}
.ph-top{display:flex;align-items:center;gap:9px;margin-bottom:2px}
.ph-top img{width:26px;height:26px}
.ph-top span{font:700 15px/1 var(--f-disp);color:var(--ink)}
.ph-chip{align-self:flex-start;font:600 11px/1 var(--f-body);color:#9a5b00;background:#fdf1dc;border:1px solid #f4dcae;padding:6px 10px;border-radius:999px}
.ph-op{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 12px;box-shadow:0 6px 16px -12px rgba(10,60,120,.3)}
.ph-op__t{font:600 13px/1.2 var(--f-body);color:var(--ink)}
.ph-op__s{font-size:10.5px;color:var(--slate);margin-top:2px}
.ph-op__m{font:700 14px/1 var(--f-disp);color:var(--emerald);flex:none}
.ph-op__m.off{color:var(--slate-3)}
.ph-cta{display:flex;gap:8px;margin-top:auto}
.ph-cta span{flex:1;text-align:center;font:600 12px/1 var(--f-body);padding:11px 0;border-radius:11px}
.ph-cta span:first-child{color:#fff;background:var(--grad)}
.ph-cta span:last-child{color:var(--ink-2);background:var(--card);border:1px solid var(--line)}

/* ── MOCKUPS DE FEATURE (inline, animados al revelar) ── */
.fmedia2--mk{padding:16px}
.fmk{display:flex;flex-direction:column;gap:13px;max-height:400px;overflow:hidden;font-variant-numeric:tabular-nums}
.fmk__h{display:flex;align-items:center;justify-content:space-between;gap:10px}
.fmk__h .lab{margin:0}
.fmk__live{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ok)}
.fmk__live b{width:6px;height:6px;border-radius:50%;background:var(--ok);animation:pulse 1.8s infinite}
.fmk-trk{height:7px;border-radius:99px;background:#e6eef8;overflow:hidden;margin-top:5px}
.fmk-fl{height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--azure-deep),var(--azure-lt));transition:width 1.2s cubic-bezier(.2,.7,.3,1)}
.reveal.in .fmk-fl{width:var(--w)}
.fmk-fl--gold{background:linear-gradient(90deg,#a9760f,var(--gold-lt))}
.fmk-fl--mix{background:linear-gradient(90deg,var(--azure),var(--emerald-br))}
.fmk-fl--em{background:linear-gradient(90deg,var(--emerald),var(--emerald-br))}

/* 1 · Probabilidad — gauge semicircular */
.fmk-gauge{text-align:center;padding-top:2px}
.fmk-gauge__svg{width:196px;max-width:76%;height:auto;display:block;margin:0 auto}
.fmk-gauge__trk{fill:none;stroke:#e2ebf6;stroke-width:11;stroke-linecap:round}
.fmk-gauge__arc{fill:none;stroke:url(#rg);stroke-width:11;stroke-linecap:round;stroke-dasharray:157.1;stroke-dashoffset:157.1;transition:stroke-dashoffset 1.5s cubic-bezier(.3,.7,.3,1)}
.reveal.in .fmk-gauge__arc{stroke-dashoffset:50.3}
.fmk-gauge__verd{font-family:var(--f-disp);font-weight:700;font-size:17px;line-height:1.12;color:var(--ok);margin-top:-14px;padding:0 6px;text-wrap:balance}
.scene .fmk-gauge__verd{font-size:14.5px;margin-top:-12px}
.fmk-gauge__cap{font-family:var(--f-mono);font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--mut);margin-top:4px}
.fmk-facs{display:flex;flex-direction:column;gap:9px}
.fmk-fac__top{display:flex;align-items:baseline;justify-content:space-between;font-size:12px;color:var(--ink-2)}
.fmk-fac__q{font-family:var(--f-mono);font-size:10.5px;font-weight:500}
.fmk-fac__q.hi{color:var(--ok)}.fmk-fac__q.mid{color:var(--warn)}.fmk-fac__q.al{color:var(--azure)}
.fmk-verdict{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;font-family:var(--f-disp);font-weight:600;font-size:13px;color:#177a48;background:#eafaf0;border:1px solid #bfe8cf;border-radius:999px;padding:8px 14px}
.fmk-verdict svg{width:15px;height:15px;fill:none;stroke:var(--ok);stroke-width:2.6}

/* 2 · Inteligencia — liga de competidores */
.fmk-liga{display:flex;flex-direction:column;gap:10px}
.fmk-lrow{display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:10px}
.fmk-rank{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;font-family:var(--f-mono);font-size:11px;font-weight:500;background:#eef4fb;color:var(--mut)}
.fmk-lrow--lead .fmk-rank{background:linear-gradient(150deg,#a9760f,var(--gold-lt));color:#fff}
.fmk-lnm{font-size:12px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fmk-lv{font-family:var(--f-mono);font-size:11px;color:var(--mut);white-space:nowrap}
.fmk-range__lab{font-family:var(--f-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);margin-bottom:7px}
.fmk-range__bar{position:relative;height:8px;border-radius:99px;background:#e6eef8}
.fmk-range__fill{position:absolute;top:0;bottom:0;left:14%;right:16%;border-radius:99px;background:linear-gradient(90deg,var(--azure-lt),var(--emerald-br))}
.fmk-range__med{position:absolute;top:-3px;left:46%;width:3px;height:14px;border-radius:2px;background:var(--ink)}
.fmk-range__sc{display:flex;justify-content:space-between;margin-top:8px;font-family:var(--f-mono);font-size:10.5px;color:var(--ink-2)}
.fmk-range__sc b{font-weight:500;color:var(--ink)}

/* 3 · Antes de ofertar — confiabilidad */
.fmk-orgs{display:flex;flex-direction:column}
.fmk-org{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--line-2);font-size:12.5px}
.fmk-org:last-child{border:0}
.fmk-org__n{color:var(--ink-2)}
.fmk-org__m{font-family:var(--f-mono);font-size:12px;font-weight:500;color:var(--ink);white-space:nowrap}

/* 4 · Compra Ágil — presupuesto */
.fmk-budget__top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:7px}
.fmk-budget__lab{font-size:12px;color:var(--ink-2)}
.fmk-budget__val{font-family:var(--f-disp);font-weight:700;font-size:16px;color:var(--ink);font-variant-numeric:tabular-nums}
.fmk-budget__trk{height:12px;border-radius:99px;background:#e6eef8;overflow:hidden}
.fmk-budget__fl{height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--emerald),var(--emerald-br));transition:width 1.3s cubic-bezier(.2,.7,.3,1)}
.reveal.in .fmk-budget__fl{width:var(--w)}
.fmk-checks{display:flex;flex-direction:column;gap:2px}
.fmk-chk{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--ink-2);padding:7px 0}
.fmk-chk .ci{width:20px;height:20px;flex:none;color:var(--ok)}.fmk-chk .ci svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.4}

/* 5 · LiciRendimiento */
.fmk-perf{display:flex;flex-direction:column;gap:12px}
.fmk-prow__top{display:flex;align-items:baseline;justify-content:space-between;font-size:12.5px;color:var(--ink-2)}
.fmk-prow__pct{font-family:var(--f-mono);font-size:12px;font-weight:500;color:var(--ink)}

/* Chat de equipo */
.fmk-chat__h{display:flex;align-items:center;gap:10px;padding-bottom:11px;border-bottom:1px solid var(--line-2)}
.fmk-chat__av{width:34px;height:34px;border-radius:10px;flex:none;display:grid;place-items:center;background:linear-gradient(150deg,rgba(21,101,216,.12),rgba(44,139,224,.06));color:var(--azure)}
.fmk-chat__av svg{width:19px;height:19px}
.fmk-chat__nm{font:600 13.5px/1.1 var(--f-disp);color:var(--ink)}
.fmk-chat__st{display:inline-flex;align-items:center;gap:5px;font-family:var(--f-mono);font-size:10px;letter-spacing:.04em;color:var(--ok);margin-top:2px}
.fmk-chat__st b{width:6px;height:6px;border-radius:50%;background:var(--ok)}
.fmk-thread{display:flex;flex-direction:column;gap:8px;background:#eaf2fb;border-radius:14px;padding:12px}
.fmk-bub{max-width:84%;padding:9px 12px;font-size:12.5px;line-height:1.42}
.fmk-bub--in{align-self:flex-start;background:#fff;border:1px solid var(--line);border-radius:13px 13px 13px 4px;color:var(--ink-2)}
.fmk-bub--out{align-self:flex-end;background:linear-gradient(150deg,var(--emerald),var(--emerald-br));color:#fff;border-radius:13px 13px 4px 13px;box-shadow:0 6px 14px -8px rgba(46,158,90,.6)}
.fmk-tender{align-self:flex-start;max-width:90%;background:#fff;border:1px solid var(--line);border-radius:13px 13px 13px 4px;padding:10px 12px;box-shadow:0 8px 18px -12px rgba(10,60,120,.32)}
.fmk-tender__k{display:flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--azure-deep);margin-bottom:5px}
.fmk-tender__k svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.2}
.fmk-tender__t{font:600 12.5px/1.3 var(--f-body);color:var(--ink)}
.fmk-tender__m{font-family:var(--f-mono);font-size:10.5px;color:var(--mut);margin-top:4px}
.fmk-typing{align-self:flex-start;display:inline-flex;gap:4px;background:#fff;border:1px solid var(--line);border-radius:13px 13px 13px 4px;padding:11px 13px}
.fmk-typing i{width:6px;height:6px;border-radius:50%;background:var(--slate-3);animation:fmkType 1.25s infinite}
.fmk-typing i:nth-child(2){animation-delay:.16s}.fmk-typing i:nth-child(3){animation-delay:.32s}
@keyframes fmkType{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-4px);opacity:1}}
/* Entrada escalonada (última burbuja, tarjeta y "escribiendo…") */
.fmk-anim{opacity:0;transform:translateY(9px);transition:opacity .5s ease,transform .5s cubic-bezier(.2,.7,.2,1)}
.reveal.in .fmk-anim{opacity:1;transform:none}
.reveal.in .fmk-anim.d1{transition-delay:.3s}
.reveal.in .fmk-anim.d2{transition-delay:.55s}
.reveal.in .fmk-anim.d3{transition-delay:.8s}

/* SHOWCASE APPS · banda oscura + reel cinematográfico de 2 teléfonos */
.showcase{position:relative;overflow:hidden;background:linear-gradient(165deg,#0a1a2b,#0d2745 58%,#0a1a2b);color:#e7eefb}
.showcase__glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(48% 42% at 80% 16%,rgba(44,139,224,.24),transparent 62%),radial-gradient(42% 46% at 16% 92%,rgba(31,168,201,.16),transparent 64%);z-index:0}
.showcase__grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1.08fr;gap:48px;align-items:center}
.showcase__eyebrow{color:var(--gold-lt)}
.showcase h2{color:#fff}
.showcase .lede{color:#b9c9de;margin-left:0;margin-right:0}
.showcase .stores{justify-content:flex-start;margin-top:26px}
.showcase .store:focus-visible{outline:3px solid var(--gold-lt);outline-offset:2px}
.showcase__stage{display:flex;flex-direction:column;align-items:center}
.reel{display:flex;justify-content:center;align-items:flex-start;gap:26px;position:relative}

/* ── La junta ─────────────────────────────────────────────────────────────────
   Al cerrar cada vuelta del reel, los dos teléfonos cierran el hueco, se alinean
   y componen UNA sola fotografía: la mitad izquierda en uno, la derecha en el
   otro. Es la tesis del producto dicha sin palabras — el mismo equipo, en dos
   lugares distintos, mirando lo mismo. Luego se separan y siguen su bucle.

   El bisel negro que queda entre ambos NO se disimula: son dos teléfonos de
   verdad puestos uno junto al otro, y esconderlo haría que la imagen pareciera
   rota en vez de compartida. */
.dev__join{position:absolute;inset:0;overflow:hidden;opacity:0;z-index:3;pointer-events:none;
           transition:opacity .26s ease}
/* Cada pantalla enseña su mitad: la foto mide DOS pantallas de ancho y cada
   teléfono la desplaza a la suya. Así no se pierde ni un píxel por el camino. */
.dev__join img{position:absolute;top:0;height:100%;width:200%;max-width:none;object-fit:cover;object-position:center}
.dev__join-izq{left:0}
.dev__join-der{left:-100%}
/* La foto entra TARDE a propósito: termina de aparecer justo cuando los dos chasis se
   tocan (~780ms). Sin la espera se revelaba a mitad del viaje, y entonces lo que se veía
   era una imagen que aparece y luego dos teléfonos que se acercan — al revés de lo que
   la coreografía quiere contar. */
.reel.is-joined .dev__join{opacity:1;transition-delay:.46s}

/* El viaje. Se apaga la flotación —dos cosas que se buscan no siguen meciéndose—
   y cada uno recorre la mitad del hueco (26px) y corrige su desnivel. */
.reel.is-joined .dev,
.reel.is-parting .dev{animation:none;
    transition:transform .78s cubic-bezier(.65,0,.35,1),border-radius .34s ease}
.reel.is-joined .dev--ios{transform:translate(13px,16px)}
.reel.is-joined .dev--android{transform:translate(-13px,-26px)}
.reel.is-parting .dev{transform:none}

/* Las esquinas interiores se enderezan al juntarse: dos curvas enfrentadas
   dejarían un rombo de fondo justo en la costura. */
.reel.is-joined .dev--ios{border-top-right-radius:12px;border-bottom-right-radius:12px}
.reel.is-joined .dev--ios .dev__scr{border-top-right-radius:8px;border-bottom-right-radius:8px}
.reel.is-joined .dev--android{border-top-left-radius:12px;border-bottom-left-radius:12px}
.reel.is-joined .dev--android .dev__scr{border-top-left-radius:8px;border-bottom-left-radius:8px}

/* Contacto: una hebra esmeralda —el verde de la chispa de la marca— recorre la
   costura durante medio segundo. Marca el INSTANTE en que dos cosas se vuelven
   una; sin ella, la foto simplemente aparecería. */
.reel__seam{position:absolute;top:8%;bottom:8%;left:50%;width:2px;margin-left:-1px;z-index:7;
            background:linear-gradient(180deg,transparent,#34d399 22%,#a7f3d0 50%,#34d399 78%,transparent);
            opacity:0;pointer-events:none;transform:scaleY(.3)}
.reel.is-contact .reel__seam{animation:seamFlash .56s cubic-bezier(.2,.8,.2,1)}
@keyframes seamFlash{
  0%  {opacity:0;   transform:scaleY(.28)}
  30% {opacity:.9;  transform:scaleY(1)}
  100%{opacity:0;   transform:scaleY(1)}
}

/* Sin la segunda pantalla no hay mitad que juntar: media foto sola no dice nada. Se anula
   también el desplazamiento, o el teléfono que queda abriría descentrado. */
@media(max-width:960px){
  .reel__seam{display:none}
  .dev__join{display:none}
  .reel.is-joined .dev{transform:none}
}
@media(prefers-reduced-motion:reduce){
  .reel.is-joined .dev,.reel.is-parting .dev{transition:none}
  .reel__seam{display:none}
}
/* Marco de dispositivo */
/* ⚠️ El ancho y el alto van EMPAREJADOS con la proporción de las capturas (9:16).
   Estaban en 208x498 de pantalla —1:2,4— y las capturas entraban con object-fit:cover:
   se escalaban a lo alto y perdían por los lados. En la de Inteligencia se comía el
   título ('nteligencia') y media tarjeta de KPI.
   242 x 430 es exactamente 9:16, así que ahora cabe la captura entera sin recortar.
   Si algún día se cambia una medida hay que cambiar la otra, o vuelve el recorte. */
.dev{width:264px;flex:none;position:relative;background:#060f1b;border-radius:44px;padding:11px;box-shadow:0 44px 80px -32px rgba(0,0,0,.72),0 0 0 1px rgba(255,255,255,.06),inset 0 0 0 2px rgba(255,255,255,.04)}
.dev--ios{margin-top:-16px;animation:devFloatA 6.5s ease-in-out infinite}
.dev--android{border-radius:30px;margin-top:26px;box-shadow:0 40px 74px -32px rgba(0,0,0,.66),0 0 0 1px rgba(255,255,255,.05),inset 0 0 0 2px rgba(255,255,255,.035);animation:devFloatB 7.5s ease-in-out .5s infinite}
@keyframes devFloatA{0%,100%{transform:translateY(0)}50%{transform:translateY(-13px)}}
@keyframes devFloatB{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.dev__isl{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:78px;height:22px;background:#060f1b;border-radius:999px;z-index:6}
.dev__hole{position:absolute;top:13px;left:50%;transform:translateX(-50%);width:11px;height:11px;background:#060f1b;border-radius:50%;z-index:6;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.12)}
.dev__scr{position:relative;height:430px;border-radius:34px;overflow:hidden;background:radial-gradient(120% 72% at 50% 0%,#fff,var(--paper) 60%,var(--paper-2))}
.dev--android .dev__scr{border-radius:22px}
/* Escenas del reel */
.scene{position:absolute;inset:0;padding:34px 15px 15px;display:flex;flex-direction:column;gap:11px;opacity:0;transform:translateY(16px) scale(.985);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.dev--android .scene{padding-top:24px}
.scene.on{opacity:1;transform:none}
.scene .fmk-fl{width:var(--w)}
.scene .fmk-budget__fl{width:var(--w)}
.scene .fmk-gauge__arc{stroke-dashoffset:50.3}
.scene__h{display:flex;align-items:center;justify-content:space-between;gap:9px}
.scene__h b{font:700 14px/1 var(--f-disp);color:var(--ink)}
.scene__tag{font:600 9.5px/1 var(--f-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--azure-deep);background:rgba(21,101,216,.08);border:1px solid rgba(21,101,216,.16);padding:4px 8px;border-radius:999px}
.scene__live{display:inline-flex;align-items:center;gap:5px;font:600 9.5px/1 var(--f-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--ok)}
.scene__live s{width:6px;height:6px;border-radius:50%;background:var(--ok);animation:pulse 1.8s infinite}
/* Para mí */
.sc-feed{display:flex;flex-direction:column;gap:9px}
.sc-card{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:11px 12px;box-shadow:0 8px 18px -14px rgba(10,60,120,.35)}
.sc-card__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}
.sc-badge{font:700 9.5px/1 var(--f-mono);letter-spacing:.05em;padding:4px 7px;border-radius:6px}
.sc-badge--lp{color:#0b4da6;background:#e7f0fd;border:1px solid #cfe0f7}
.sc-badge--ca{color:#9a5b00;background:#fdf1dc;border:1px solid #f4dcae}
.sc-score{font:700 11px/1 var(--f-disp);color:var(--emerald);background:#eafaf0;border:1px solid #bfe8cf;padding:4px 9px;border-radius:999px;white-space:nowrap}
.sc-score--mid{color:#9a5b00;background:#fdf1dc;border-color:#f4dcae}
.sc-score--low{color:var(--slate);background:#eef3f9;border-color:#dbe6f2}
.sc-card__t{font:600 13px/1.3 var(--f-body);color:var(--ink)}
.sc-card__m{font:500 10.5px/1 var(--f-mono);color:var(--mut);margin-top:5px}
/* ¿Vale la pena? */
.sc-thead{font:600 12px/1.35 var(--f-body);color:var(--ink-2);background:var(--paper);border:1px solid var(--line);border-radius:11px;padding:9px 11px}
.sc-vbanner{display:flex;align-items:center;gap:8px;font:700 13.5px/1.2 var(--f-disp);color:#fff;background:linear-gradient(135deg,var(--emerald),var(--emerald-br));border-radius:12px;padding:12px 13px;box-shadow:0 12px 24px -14px rgba(46,158,90,.7)}
.sc-vbanner svg{width:17px;height:17px;flex:none;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
/* QR */
.sc-qr{display:grid;place-items:center;padding:4px 0 2px}
.sc-qr__frame{background:#fff;border:1px solid var(--line);border-radius:16px;padding:13px;box-shadow:0 16px 32px -18px rgba(10,60,120,.42)}
.sc-qr__svg{width:132px;height:132px;display:block}
.sc-linked{align-self:center;display:inline-flex;align-items:center;gap:7px;font:600 12.5px/1 var(--f-disp);color:#177a48;background:#eafaf0;border:1px solid #bfe8cf;border-radius:999px;padding:8px 14px;margin-top:2px}
.sc-linked svg{width:15px;height:15px;fill:none;stroke:var(--ok);stroke-width:2.6}
.sc-hint{text-align:center;font-size:11px;line-height:1.4;color:var(--slate);margin-top:2px}
/* Informe experto */
.sc-pdf{display:flex;gap:11px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:13px;padding:12px;box-shadow:0 8px 18px -14px rgba(10,60,120,.35)}
.sc-pdf__ico{width:38px;height:46px;flex:none;border-radius:6px;background:linear-gradient(160deg,#e5544e,#c2352f);color:#fff;display:grid;place-items:center;font:700 9px/1 var(--f-mono);letter-spacing:.04em;box-shadow:0 8px 16px -10px rgba(197,53,47,.6)}
.sc-pdf__t{font:600 13px/1.2 var(--f-disp);color:var(--ink)}
.sc-pdf__s{font-size:11px;color:var(--mut);margin-top:3px}
.sc-lines{display:flex;flex-direction:column;gap:7px;padding:4px 2px}
.sc-lines i{height:7px;width:100%;border-radius:99px;background:#e6eef8;display:block}
.sc-share{display:flex;align-items:center;gap:7px;margin-top:auto}
.sc-share__lab{font:600 10px/1 var(--f-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--slate);white-space:nowrap;margin-right:1px}
.sc-chip{flex:1;text-align:center;font:600 11px/1 var(--f-body);color:var(--ink-2);background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:9px 0}
/* Competidores (con gráficos) */
.sc-comp__hd{display:flex;align-items:center;gap:7px;font:600 11px/1.2 var(--f-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--azure-deep)}
.sc-comp__hd svg{width:13px;height:13px;flex:none;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sc-comp__hd b{color:var(--ink);font-weight:600;text-transform:none;letter-spacing:0}
.sc-comp__ch{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:11px 13px 10px;box-shadow:0 8px 18px -14px rgba(10,60,120,.35)}
.sc-comp__lab{font:600 10px/1 var(--f-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--slate);margin-bottom:6px}
.sc-bars{display:flex;align-items:flex-end;gap:12px;height:88px;margin-top:16px;padding:0 2px}
.sc-bar{flex:1;min-height:8px;border-radius:6px 6px 0 0;background:linear-gradient(180deg,var(--azure-lt),var(--azure-deep));position:relative;display:flex;justify-content:center}
.sc-bar--lead{background:linear-gradient(180deg,var(--gold-lt),#a9760f)}
.sc-bar__v{position:absolute;top:-15px;font:600 10px/1 var(--f-mono);color:var(--ink)}
.sc-xr{display:flex;gap:12px;margin-top:7px;padding:0 2px}
.sc-xr span{flex:1;text-align:center;font-size:8.5px;line-height:1.1;color:var(--slate)}
.sc-kpis{display:flex;gap:7px}
.sc-kpi{flex:1;text-align:center;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:9px 4px}
.sc-kpi b{display:block;font:700 14px/1 var(--f-disp);color:var(--ink);font-variant-numeric:tabular-nums}
.sc-kpi span{display:block;font:600 8px/1.2 var(--f-mono);letter-spacing:.03em;text-transform:uppercase;color:var(--slate);margin-top:4px}
.sc-sells .sc-comp__lab{margin-bottom:2px}
/* Caption + dots */
.reel-cap{margin:24px auto 0;text-align:center;font:600 15px/1.4 var(--f-disp);color:#fff;min-height:42px;max-width:360px;text-wrap:balance}
.reel-dots{display:flex;gap:7px;justify-content:center;margin-top:12px}
.reel-dot{width:7px;height:7px;border-radius:999px;background:rgba(255,255,255,.26);transition:width .35s,background .35s}
.reel-dot.on{width:22px;background:var(--gold-lt)}

/* ── MAPA DEL MERCADO · grafo 3D, columna derecha del hero ── */
/* Abierto sobre el papel del hero: sin caja, sin borde, sin sombra. El rótulo,
   la leyenda y el pie son etiquetas tipográficas flotando, no cromo de ventana. */
.gmap{position:relative;display:flex;flex-direction:column;opacity:0;transition:opacity .4s ease}
.gmap[hidden]{display:none!important}
.gmap.is-on{opacity:1}
/* Si el mapa no carga (o no hay JS), el hero se queda en una sola columna. */
.hero2--solo{grid-template-columns:1fr}
/* Rótulo y EN VIVO: misma línea base, al ancho del área del mapa. Sin divisoria. */
.gmap__h{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:7px 2px 12px}
.gmap__t{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--azure-deep);white-space:nowrap}
.gmap__t b{width:7px;height:7px;flex:none;border-radius:50%;background:var(--ok);animation:pulse 1.8s infinite}
.gmap__live{display:inline-flex;align-items:center;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ok);white-space:nowrap}
.gmap__stage{position:relative;flex:0 0 auto;height:clamp(420px,58vh,580px);min-height:360px;overflow:hidden;background:radial-gradient(58% 56% at 50% 46%,rgba(44,139,224,.07),transparent 74%)}
.gmap__canvas{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:manipulation}
/* Capa de acentos flotantes sobre el lienzo (jamás intercepta el puntero) */
.gmap__over{position:absolute;inset:0;z-index:3;pointer-events:none}
/* Tarjeta de oportunidad real: píldora de días + tarjeta que se despliega.
   La bola del canvas aterriza justo sobre la píldora (traspaso invisible). */
.gmap__op{position:absolute;left:13px;bottom:13px;display:flex;align-items:center;gap:8px;max-width:calc(100% - 26px);opacity:0;visibility:hidden;transition:opacity .22s ease}
.gmap__op[hidden]{display:none!important}
.gmap__op.is-on{opacity:1;visibility:visible}
.gmap__op-d{flex:none;display:inline-flex;align-items:center;gap:5px;height:40px;padding:0 12px;border-radius:12px;font-family:var(--f-mono);font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums;color:#fff;background:var(--grad);box-shadow:0 8px 18px -10px rgba(44,139,224,.7);transform:scale(1);transition:transform .16s cubic-bezier(.22,1,.36,1)}
.gmap__op-d.is-pop{transform:scale(1.06)}
.gmap__op-d .ic{width:12px;height:12px;flex:none;stroke-width:2.2;opacity:.85}
.gmap__op-d .ic .au{stroke:#fff}
.gmap__op-c{display:block;min-width:0;padding:8px 12px;border-radius:12px;color:inherit;text-decoration:none;background:rgba(255,255,255,.86);border:1px solid rgba(21,101,216,.14);box-shadow:0 14px 30px -22px rgba(10,60,120,.5);backdrop-filter:blur(8px) saturate(1.15);-webkit-backdrop-filter:blur(8px) saturate(1.15);clip-path:inset(0 100% 0 0 round 12px);pointer-events:none;transition:clip-path .35s cubic-bezier(.22,1,.36,1),transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease}
.gmap__op-c.is-open{clip-path:inset(0 0 0 0 round 12px);pointer-events:auto;cursor:pointer}
.gmap__op-c.is-open:hover{transform:translateY(-2px);background:rgba(255,255,255,.95);border-color:rgba(21,101,216,.32);box-shadow:0 20px 36px -20px rgba(10,60,120,.6)}
.gmap__op-c:focus-visible{outline:3px solid var(--azure);outline-offset:3px}
.gmap__op-c.is-fold{transition-duration:.3s}
.gmap__op-in{opacity:0;transition:opacity .24s ease}
.gmap__op-c.is-open .gmap__op-in{opacity:1;transition-delay:.12s}
.gmap__op-r{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.gmap__op-k{display:inline-flex;align-items:center;gap:4px;font:700 9px/1 var(--f-mono);letter-spacing:.06em;padding:4px 7px;border-radius:6px}
.gmap__op-k .ic{width:11px;height:11px;stroke-width:2.2}
.gmap__op-k--lp{color:#0b4da6;background:#e7f0fd;border:1px solid #cfe0f7}
.gmap__op-k--lp .ic .au{stroke:#0b4da6}
.gmap__op-k--ca{color:#9a5b00;background:#fdf1dc;border:1px solid #f4dcae}
.gmap__op-k--ca .ic .au{stroke:#9a5b00}
.gmap__op-m{display:inline-flex;align-items:center;gap:4px;font:500 10.5px/1 var(--f-mono);color:var(--ink);font-variant-numeric:tabular-nums}
.gmap__op-m .ic{width:12px;height:12px;stroke-width:1.9;color:var(--slate-3)}
.gmap__op-m[hidden]{display:none}
.gmap__op-t{display:block;max-width:264px;font:600 11.5px/1.25 var(--f-body);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gmap__op-o{display:flex;align-items:center;gap:4px;max-width:264px;margin-top:3px;font:400 9.5px/1.3 var(--f-mono);font-style:normal;color:var(--slate-3)}
.gmap__op-o .ic{width:11px;height:11px;flex:none;stroke-width:2}
.gmap__op-o span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Etiqueta del nodo bajo el cursor */
.gmap__chip{position:absolute;left:0;top:0;z-index:4;max-width:74%;padding:7px 10px;border-radius:9px;background:rgba(8,22,38,.94);border:1px solid rgba(120,170,220,.3);box-shadow:0 14px 30px -16px rgba(10,40,80,.85);pointer-events:none;opacity:0;transition:opacity .16s ease}
.gmap__chip.is-on{opacity:1}
.gmap__chip-t{display:block;font:600 11.5px/1.25 var(--f-body);color:#eaf3fb}
.gmap__chip-m{display:block;margin-top:3px;font-family:var(--f-mono);font-size:10px;color:#9fc3e2;font-variant-numeric:tabular-nums}
/* Pie: leyenda + cifras, sueltas sobre el papel. Sin divisoria ni fondo. */
.gmap__foot{display:flex;align-items:baseline;justify-content:space-between;gap:9px 16px;flex-wrap:wrap;padding:12px 2px 0}
.gmap__legend{list-style:none;display:flex;gap:14px;margin:0;padding:0}
.gmap__lg{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--mut);white-space:nowrap}
.gmap__lg i{width:7px;height:7px;flex:none;border-radius:50%}
.gmap__lg--org i{background:var(--azure-lt);box-shadow:0 0 8px rgba(44,139,224,.6)}
.gmap__lg--prov i{background:var(--emerald-br);box-shadow:0 0 8px rgba(55,176,106,.55)}
.gmap__lg--rub i{background:var(--gold-lt);box-shadow:0 0 8px rgba(224,166,44,.55)}
.gmap__note{margin:0;font-family:var(--f-mono);font-size:9.5px;line-height:1.4;letter-spacing:.03em;color:var(--slate-3);font-variant-numeric:tabular-nums;text-align:right}
.gmap__note:empty{display:none}
.gmap__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);border:0;white-space:nowrap}
@media(max-width:960px){.gmap__h{padding-top:0}.gmap__stage{height:clamp(300px,40vh,380px);min-height:280px}.gmap__foot{justify-content:center}.gmap__legend{justify-content:center;flex-wrap:wrap}.gmap__note{text-align:center;width:100%}}
@media(max-width:560px){.gmap__op{left:10px;bottom:10px}.gmap__op-t,.gmap__op-o{max-width:190px}.gmap__legend{gap:11px}.gmap__lg{font-size:9px}}

/* RESPONSIVE */
@media(max-width:960px){.hero2{grid-template-columns:1fr;gap:36px;padding:26px 0 44px}.showcase__grid{grid-template-columns:1fr;gap:34px}.showcase__copy{text-align:center}.showcase .lede{margin-left:auto;margin-right:auto}.showcase .stores{justify-content:center}.dev--android{display:none}.dev--ios{margin-top:0}.reel{gap:0}}
@media(max-width:900px){.frow2{grid-template-columns:1fr;gap:26px}.frow2.flip .fmedia2{order:-1}.escala{grid-template-columns:1fr 1fr}.pricing{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.board__grid{grid-template-columns:1fr}.board__row{border-right:0;border-bottom:1px solid rgba(120,170,220,.1)}.board__row:last-child{border-bottom:0}}
@media(max-width:640px){.tape__lab{display:none}.pricing{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.escala{grid-template-columns:1fr}.chips2{gap:16px}.pricing{grid-template-columns:1fr}.plan--pop{transform:none}.seal{width:min(300px,86vw)}.cf{flex-direction:column}.cfi{width:min(300px,86vw)}.brand img{height:32px}}

/* TELÉFONO
   Ajustes medidos en pantalla real (360–560 px). Nada de esto toca el
   escritorio: todos los bloques viven dentro de consultas de ancho máximo. */
@media(max-width:700px){
  /* El rótulo del panel repite palabra por palabra el título que está justo
     encima; en una columna solo aportaba puntos suspensivos. */
  .board__title{display:none}
  .board__head{padding:12px 15px;gap:10px}
  .board__row{padding:14px 15px;gap:12px}
  /* Cifras del mapa: son dato, no adorno. A 9,5 px no se leían. */
  .gmap__note{font-size:11px}
  .gmap__live{font-size:10.5px}
}
@media(max-width:560px){
  /* Barra superior. El micro-rótulo de 6,5 px era ilegible y, junto con el
     nombre, empujaba «Empezar gratis» ~75 px fuera de la pantalla: el botón
     principal aparecía cortado por el borde. En el teléfono queda la marca
     gráfica, que sí se reconoce, y las dos acciones completas. */
  .lnav{gap:10px;padding:12px 0}
  .lnav .lfbrand__word{display:none}
  .lnav .lfbrand{padding:5px 0}
  .lnav .lfbrand__mark{height:36px;width:36px}
  .lnav__cta{gap:10px;flex:none}
  .lnav__login{font-size:14px;padding:12px 2px}
  .lnav__cta .btn{font-size:14px;padding:.8em 1.1em}

  /* Hero: comprimir lo justo para que el botón entre en la primera pantalla
     de un teléfono chico, contando la barra del navegador. */
  .hero2{padding:14px 0 40px}
  .eyebrow2{font-size:11px;letter-spacing:.1em;padding:5px 11px}
  .hero2 h1{font-size:clamp(30px,8.2vw,35px);margin-top:15px}
  .sub2{margin-top:15px;font-size:16.5px}
  .actions2{margin-top:22px;gap:10px}
  .actions2 .btn{flex:1 1 100%;justify-content:center}
  .micro2{margin-top:12px;font-size:11.5px}
  .chips2{margin-top:24px;gap:18px}

  /* Tarjeta de oportunidad del mapa: aprovechar el ancho disponible. */
  .gmap__op-t,.gmap__op-o{max-width:min(52vw,230px)}
  .gmap__lg{font-size:10px}

  /* Planes en una columna: hay ancho de sobra, no hace falta letra chica. */
  .plan__feats li{font-size:13.5px}
  .plan__tag{font-size:12.5px}

  /* Pie: la fila de enlaces medía 353 px y se salía de la pantalla. */
  .foot-in{justify-content:center;text-align:center}
  .foot-links{justify-content:center;gap:0 20px}
  .foot-links a{padding:11px 2px}
  .foot__sponsor{padding:7px 0}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.gmap.is-on{opacity:1}}

/* ── "El músculo detrás": imagen a la izquierda, argumento a la derecha ──────
   Antes iba centrada y desperdiciaba los dos costados. La columna de texto se
   alinea a la izquierda porque un titular centrado sobre una columna estrecha
   obliga al ojo a volver al centro en cada línea. */
.escena{display:grid;grid-template-columns:minmax(300px,44%) 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.escena__fig{position:relative}
.escena__fig img{display:block;width:100%;height:auto;max-width:460px;margin-inline:auto}
.escena__txt{max-width:600px}
.lede--izq{margin-left:0;margin-right:0}

/* Manifiesto de cifras: renglones con el número alineado a la derecha en una
   columna fija, de modo que los cuatro se apilen perfectamente. Es lo que hace
   que se lean como un inventario y no como adornos sueltos. */
.manif{margin:34px 0 0;display:grid;grid-template-columns:auto 1fr;column-gap:18px;align-items:baseline}
.manif dt,.manif dd{margin:0;padding:15px 0;border-top:1px solid var(--line)}
.manif dt:last-of-type,.manif dd:last-of-type{border-bottom:1px solid var(--line)}
/* min-width para que el "16" quede alineado bajo los millones, no pegado al texto. */
.manif .en{justify-self:end;min-width:5.6ch;text-align:right;font-size:clamp(22px,2.3vw,30px)}
.manif .el{font-size:14px;color:var(--slate)}

@media(max-width:980px){
  /* Una sola columna: primero la imagen, que es el gancho visual. */
  .escena{grid-template-columns:1fr;gap:34px}
  .escena__fig img{max-width:340px}
  .escena__txt{max-width:none}
}
@media(max-width:560px){
  .escena__fig img{max-width:250px}
  .manif{column-gap:12px}
  .manif dt,.manif dd{padding:13px 0}
  .manif .en{min-width:4.8ch}
  .manif .el{font-size:13px}
}

/* ── Chat de la maqueta: nota de voz y documento adjunto ─────────────────────
   Son la prueba visual de que el chat es un mensajero de verdad y no un panel
   de avisos. La onda se dibuja con barras: pesa nada y se anima sola. */
.fmk-voz{align-self:flex-end;display:flex;align-items:center;gap:8px;max-width:84%;
  background:linear-gradient(150deg,var(--emerald),var(--emerald-br));color:#fff;
  border-radius:13px 13px 4px 13px;padding:8px 11px;box-shadow:0 6px 14px -8px rgba(46,158,90,.6)}
.fmk-voz__p{flex-shrink:0;width:19px;height:19px;border-radius:50%;background:rgba(255,255,255,.24);
  display:grid;place-items:center}
.fmk-voz__p svg{width:9px;height:9px;fill:#fff;stroke:none}
.fmk-voz__w{flex:1;display:flex;align-items:center;gap:1.5px;height:17px}
.fmk-voz__w i{flex:1;min-width:1.5px;border-radius:1px;background:rgba(255,255,255,.62)}
/* Las primeras barras van sólidas: es la parte ya escuchada. */
.fmk-voz__w i:nth-child(-n+8){background:#fff}
.fmk-voz__t{flex-shrink:0;font-family:var(--f-mono);font-size:9.5px;opacity:.9}

.fmk-doc{align-self:flex-start;display:flex;align-items:center;gap:8px;max-width:88%;
  background:#fff;border:1px solid var(--line);border-radius:13px 13px 13px 4px;padding:8px 11px}
.fmk-doc__i{flex-shrink:0;width:22px;height:22px;border-radius:6px;background:rgba(229,84,78,.10);
  display:grid;place-items:center}
.fmk-doc__i svg{width:12px;height:12px;fill:none;stroke:var(--danger);stroke-width:1.7;stroke-linejoin:round}
.fmk-doc__n{font-size:11.5px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ── Lo que hacen las apps: lista de funciones junto al reel ─────────────────
   OJO: esta sección va sobre FONDO OSCURO (.showcase). Los colores salen de esa
   escala, no de la del resto del landing: con var(--ink) el título quedaba negro
   sobre azul marino, es decir, invisible.
   El contenido va envuelto en .appfx__c porque la grilla es de DOS columnas; un
   texto suelto dentro del <li> se convierte en un item más y salta de fila. */
.appfx{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:18px}
.appfx li{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}
.appfx__c{font-size:15px;line-height:1.55;color:#b9c9de}
.appfx b{display:block;color:#fff;font-weight:600;margin-bottom:2px}
.appfx__i{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14)}
.appfx__i svg{width:17px;height:17px;fill:none;stroke:var(--gold-lt);stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}

@media(max-width:560px){
  .appfx li{gap:12px}
  .appfx__c{font-size:14px}
  .appfx__i{width:30px;height:30px}
}

/* ── Capturas reales dentro de los teléfonos ──────────────────────────────────────
   Sustituyen a las maquetas dibujadas a mano. Van SIN las barras del sistema, así que
   encajan casi exactas en el marco (0,497 frente al 0,509 que pide) y además no delatan
   que fueron tomadas en Android — que importa en el marco de iPhone.

   `object-fit:cover` con el anclaje ARRIBA: si sobra un pelo de alto, se recorta por abajo,
   nunca por la cabecera, que es donde está el título de cada pantalla. */
/* La escena traía relleno de 34px porque dibujaba la maqueta a mano. Con una captura real
   ese margen deja un borde feo alrededor: la pantalla del teléfono debe ir a sangre. */
.scene:has(> .dev__shot){ padding:0; gap:0; }

.dev__shot{
  width:100%; height:100%;
  object-fit:cover; object-position:top center;
  display:block; border-radius:20px;
  background:var(--paper);
}
/* El vídeo hereda lo mismo. `muted` va en la etiqueta, no aquí: sin ese atributo los
   navegadores bloquean la reproducción automática aunque el fichero no tenga sonido. */
video.dev__shot{ pointer-events:none; }