/* HyperUX · the landing, second night (operator 2026-10-07: «más motion en cada card», «tope de gama, optimizada», «la
   versión light le queda mejor», «a veces siento que hay opacity, no se ve bien»). Structure from America.gov
   (research/AMERICA_GOV_2026-10-07.md), tokens from DESIGN.md.
   Performance rules, measured with checks/perf.mjs: no backdrop-filter inside the page (only the small fixed bar, menu
   and dock), solid surfaces instead of glass, no CSS transform transitions where GSAP animates, offscreen sections skipped.
   #landing is a fixed scroller: never transform or filter it (its fixed children would stop being fixed). */
.landing{position:fixed;inset:0;z-index:7;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;opacity:0;visibility:hidden;
  --lx-gut:24px;--lx-ink2:rgba(245,245,247,.82);--lx-ink3:rgba(245,245,247,.6);
  --lx-surf:rgba(26,26,26,.88);--lx-surf-2:rgba(255,255,255,.06);--lx-line:rgba(255,255,255,.09);
  --lx-field:rgba(26,26,26,.96);--lx-field-line:rgba(255,255,255,.1);--lx-tile:rgba(255,255,255,.06);
  --lx-shadow:0 30px 60px -30px rgba(0,0,0,.55),0 2px 6px rgba(0,0,0,.18);scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
body[data-ui="light"] .landing{--lx-ink2:rgba(22,23,28,.8);--lx-ink3:rgba(22,23,28,.58);--lx-surf:rgba(255,255,255,.9);--lx-surf-2:rgba(22,23,28,.045);--lx-line:rgba(22,23,28,.08);
  --lx-field:#fff;--lx-field-line:rgba(22,23,28,.09);--lx-tile:rgba(22,23,28,.05);--lx-shadow:0 30px 60px -32px rgba(20,30,60,.32),0 2px 6px rgba(20,30,60,.07)}
body.on-landing .landing{visibility:visible}
.landing :focus-visible{outline:2px solid var(--best);outline-offset:3px}
.landing .lx-composer input:focus-visible{outline:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lx-wrap{width:min(1180px,calc(100% - 2 * var(--lx-gut)));margin:0 auto}
.lx-sec{padding:150px 0}
.lx-h2{font-size:clamp(34px,4.6vw,64px);line-height:1.02;letter-spacing:-.045em;font-weight:300}
.lx-h2 .w,.lx-h3 .w{padding-bottom:.06em}
.lx-xl{font-size:clamp(40px,6vw,92px);line-height:.98}
.lx-h3{font-size:clamp(26px,2.8vw,40px);line-height:1.06;letter-spacing:-.04em;font-weight:300}
.lx-lead{font-size:clamp(16px,1.35vw,19px);line-height:1.5;color:var(--lx-ink2);letter-spacing:-.012em}
.lx-note{font-size:13.5px;line-height:1.5;color:var(--lx-ink3)}
.lx-kicker{font-size:14px;font-weight:500;letter-spacing:.02em;color:var(--best);margin-bottom:16px}
.lx-ex{display:inline-block;font-size:11px;letter-spacing:.02em;color:var(--lx-ink3);border:1px solid var(--line-2);border-radius:999px;padding:2px 8px;vertical-align:middle;white-space:nowrap}
.lx-surface{background:var(--lx-surf);border:1px solid var(--lx-line);box-shadow:var(--lx-shadow)}
/* no content-visibility: its placeholder heights made the page jump while scrolling and menu links land 780 px off (measured 2026-10-07) */

/* ── Top: the wordmark and the menu pill (the bar hides going down, comes back going up) ── */
/* the bar keeps to the content's column (.lx-wrap, 1180) on a wide monitor, as /agencias does (operador 15/10) */
.lx-top{position:fixed;top:0;left:0;right:0;height:64px;z-index:9;display:flex;align-items:center;justify-content:space-between;padding:0 max(var(--lx-gut),calc((100% - 1180px) / 2));pointer-events:none}
.lx-top>*{pointer-events:auto}
.lx-brand,.lx-menu-btn{background:var(--glass);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);box-shadow:inset 0 0 0 1px var(--line)}
.lx-brand{display:flex;align-items:center;font-weight:700;font-size:18px;letter-spacing:-.045em;padding:8px 15px;border-radius:999px}
.lx-menu-btn{font-size:13px;font-weight:500;padding:11px 18px;border-radius:999px;color:var(--ink)}

/* ── Menu ── */
.lx-veil{position:fixed;inset:0;z-index:10;background:rgba(8,10,20,.26);opacity:0;visibility:hidden}
body[data-ui="light"] .lx-veil{background:rgba(220,228,240,.4)}
.lx-menu{position:fixed;top:68px;right:max(var(--lx-gut),calc((100% - 1180px) / 2));z-index:11;width:310px;max-width:calc(100% - 2 * var(--lx-gut));border-radius:24px;padding:10px;visibility:hidden;opacity:0;transform-origin:100% 0;
  background:var(--lx-surf);border:1px solid var(--lx-line);box-shadow:0 30px 60px -20px rgba(0,0,0,.4)}
.lx-menu>a,.lx-menu>button{display:flex;align-items:center;justify-content:space-between;width:100%;font-size:19px;letter-spacing:-.025em;padding:12px 14px;border-radius:14px;text-align:left;transition:background .2s}
.lx-menu>a:hover,.lx-menu>button:hover{background:var(--lx-surf-2)}
.lx-menu hr{border:0;border-top:1px solid var(--lx-line);margin:8px 6px}
.lx-menu .lx-go{justify-content:center;font-size:15px;font-weight:500;background:var(--pill-bg);color:var(--pill-ink);border-radius:999px;margin-top:6px}
.lx-menu .lx-go:hover{background:var(--pill-bg)}
.lx-bgpick{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 8px 6px 14px;font-size:14px;color:var(--lx-ink2)}

/* segmented control (menu, autonomy, modal) */
.lx-seg{position:relative;display:flex;padding:4px;border-radius:999px;background:var(--lx-surf-2)}
.lx-seg .ind{position:absolute;top:4px;bottom:4px;left:0;width:0;border-radius:999px;background:var(--pill-bg)}
.lx-seg button{position:relative;z-index:1;flex:1;height:34px;padding:0 12px;border-radius:999px;font-size:13.5px;color:var(--lx-ink2);white-space:nowrap;transition:color .3s}
.lx-seg button.on{color:var(--pill-ink)}

/* ── Composer (the hero one and the dock share it) ── */
.lx-composer{position:relative;display:flex;align-items:center;gap:6px;height:64px;padding:0 8px 0 24px;border-radius:32px;background:var(--lx-field);
  box-shadow:inset 0 0 0 1px var(--lx-field-line),0 18px 40px -18px rgba(0,0,0,.4);transition:box-shadow .25s}
.lx-composer:focus-within{box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 30%,transparent),0 22px 46px -18px rgba(0,0,0,.45)}
.lx-composer input{flex:1;min-width:0;height:100%;background:transparent;border:0;outline:0;font-size:17px;letter-spacing:-.015em;color:var(--ink)}
.lx-composer .lx-ph{position:absolute;left:24px;right:104px;top:0;bottom:0;display:flex;align-items:center;pointer-events:none;color:var(--lx-ink3);font-size:17px;letter-spacing:-.015em;white-space:nowrap;overflow:hidden}
.lx-composer .lx-ph span{display:inline-block;max-width:100%}
.lx-composer.typed .lx-ph{visibility:hidden}
.lx-surp,.lx-send{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:var(--lx-ink2);transition:background .2s,color .2s}
.lx-surp:hover{background:var(--lx-surf-2);color:var(--ink)}
.lx-send{background:var(--lx-surf-2);color:var(--lx-ink3)}
.lx-composer.typed .lx-send{background:var(--pill-bg);color:var(--pill-ink)}
.lx-dock{position:fixed;left:50%;bottom:20px;z-index:8;width:min(580px,calc(100% - 2 * var(--lx-gut)));margin-left:calc(min(580px,calc(100% - 2 * var(--lx-gut))) / -2);opacity:0;visibility:hidden}
.lx-dock .lx-composer{height:56px;padding-left:22px;background:var(--glass);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4)}
/* into the dark stage and out of it, its colors fade (they swapped at once, over a background already dark: operator 2026-10-08) */
.lx-dock .lx-composer,.lx-dock .lx-composer input,.lx-dock .lx-composer .lx-ph,.lx-dock .lx-composer button,.lx-top .lx-brand,.lx-top button{transition:background-color .5s var(--e-io),border-color .5s var(--e-io),color .5s var(--e-io),box-shadow .5s var(--e-io)}
.lx-dock .lx-composer input,.lx-dock .lx-composer .lx-ph{font-size:16px}
.lx-dock .lx-composer .lx-ph{left:22px}
.lx-dock .lx-surp,.lx-dock .lx-send{width:40px;height:40px}

/* ── Hero ── */
.lx-hero{padding:132px 0 40px;text-align:center}
.lx-hello{font-size:clamp(46px,8vw,120px);line-height:1;letter-spacing:-.055em;font-weight:300}
.lx-hello .w{padding-bottom:.08em}
.lx-sub{font-size:clamp(17px,1.6vw,22px);color:var(--lx-ink2);letter-spacing:-.02em;margin-top:20px;line-height:1.4}
.lx-sub b{font-weight:500;color:var(--ink)}
.lx-show{position:relative;width:min(940px,100%);margin:44px auto 0;perspective:1400px}
.lx-card{position:relative;border-radius:34px;padding:10px;background:var(--lx-surf);border:1px solid var(--lx-line);box-shadow:0 50px 90px -40px rgba(0,0,0,.45),0 2px 8px rgba(0,0,0,.08);transform-style:preserve-3d;will-change:transform}
.lx-screen{position:relative;border-radius:25px;overflow:hidden;aspect-ratio:16/10;background:#f4f4f2;isolation:isolate}
.lx-shot{position:absolute;inset:0;width:100%;height:auto;min-height:100%;object-fit:cover;object-position:50% 0;opacity:0;will-change:transform}
.lx-shot.on{opacity:1}
/* the hero film: the owner (photo), the field of squares while uxy builds, the page; a tag and uxy's line on top */
.lx-film .lx-person{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;opacity:0;will-change:transform}
.lx-film .lx-person.on{opacity:1}
.lx-film .lx-shot{z-index:2}
.lx-gen{position:absolute;inset:0;z-index:3;width:100%;height:100%;opacity:0;image-rendering:pixelated;pointer-events:none}
.lx-film-ui{position:absolute;left:18px;right:18px;bottom:18px;z-index:5;text-align:left;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;pointer-events:none}
.lx-tag{display:inline-flex;align-items:center;gap:0;height:40px;padding:0 16px 0 12px;border-radius:999px;background:rgba(16,17,22,.88);color:#F5F5F7;font-size:14.5px;letter-spacing:-.01em;white-space:nowrap;box-shadow:0 12px 26px -12px rgba(0,0,0,.55);flex:none;max-width:100%}
.lx-tag .av{width:0;height:20px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#F5F5F7;color:#16171C;transition:width .45s var(--e-out),margin .45s var(--e-out);flex:none}
.lx-tag .av svg{width:12px;height:12px}
.lx-tag[data-s="work"] .av,.lx-tag[data-s="done"] .av{width:20px;margin-right:9px}
.lx-tag[data-s="work"] .av{animation:lxpulse 1.2s var(--e-io) infinite}
.lx-tag[data-s="done"] .av{background:var(--up);color:#fff}
.lx-tag .tw{display:block;overflow:hidden;height:20px;line-height:20px;padding-left:4px}
.lx-tag .t{display:block}
.lx-said{display:flex;gap:10px;align-items:flex-start;max-width:min(340px,58%);padding:12px 15px 13px 12px;border-radius:18px;background:#fff;color:#16171C;font-size:14.5px;line-height:1.4;letter-spacing:-.01em;box-shadow:0 18px 40px -16px rgba(0,0,0,.45);opacity:0}
.lx-said .av{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#16171C;color:#F5F5F7;margin-top:1px}
.lx-said .av svg{width:12px;height:12px}
.lx-said small{display:block;font-size:11.5px;color:rgba(22,23,28,.55);margin-bottom:2px}
.lx-composer .lx-ph.typing span::after{content:'';display:inline-block;width:1.5px;height:1.05em;margin-left:1px;vertical-align:-.15em;background:var(--ink);animation:lxcaret 1s steps(1) infinite}
.lx-composer.go .lx-send{background:var(--pill-bg);color:var(--pill-ink)}
.lx-show>.lx-composer{position:absolute;top:22px;left:22px;right:22px;z-index:3}
.lx-pager{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:22px}
.lx-pager button{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:var(--lx-ink2);background:var(--lx-surf-2);transition:background .2s,color .2s}
.lx-pager button:hover{color:var(--ink)}
.lx-dots{display:flex;gap:6px;align-items:center;padding:0 6px}
.lx-dots i{width:6px;height:6px;border-radius:3px;background:var(--lx-ink3);cursor:pointer;transition:width .45s var(--e-out),background .3s}
.lx-dots i.on{width:22px;background:var(--ink)}
.lx-cap{margin-top:12px;font-size:13px;color:var(--lx-ink3);min-height:20px}
.landing[data-v="b"] .lx-card,.landing[data-v="b"] .lx-pager,.landing[data-v="b"] .lx-cap{display:none}
.landing[data-v="b"] .lx-show{width:min(680px,100%);margin-top:52px}
.landing[data-v="b"] .lx-show>.lx-composer{position:relative;top:auto;left:auto;right:auto}
.landing[data-v="b"] .lx-hero{padding-bottom:0;min-height:min(78vh,760px);display:flex;flex-direction:column;justify-content:center}
.lx-fieldwrap{display:none;position:relative;width:min(1100px,100%);margin:40px auto 0;aspect-ratio:16/9;border-radius:28px;overflow:hidden}
.lx-fieldwrap canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}
.lx-fieldwrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;opacity:0;border-radius:28px}
.landing[data-v="c"] .lx-card,.landing[data-v="c"] .lx-pager,.landing[data-v="c"] .lx-cap{display:none}
.landing[data-v="c"] .lx-fieldwrap{display:block}
.landing[data-v="c"] .lx-show{width:min(1100px,100%);margin-top:28px}
.landing[data-v="c"] .lx-show>.lx-composer{top:auto;bottom:28px;left:0;right:0;margin:0 auto;width:min(620px,calc(100% - 32px))}

/* ── Statement: a dark stage pinned while you read; the background turns into what each phrase says ── */
.lx-saysec{position:relative;height:540vh;margin-top:120px}
/* the sky melts into the dark stage instead of ending in a straight cut */
.lx-saysec::before{content:'';position:absolute;left:0;right:0;top:-120px;height:120px;background:linear-gradient(to bottom,rgba(12,12,12,0),#0c0c0c);pointer-events:none}
body[data-bg="cosmos"] .lx-saysec::before{display:none}
.lx-saypin{position:sticky;top:0;height:100vh;overflow:hidden;background:var(--say-bg,#0e0e0e);color:#F5F5F7;transition:background-color .9s var(--e-io)}
body[data-bg="cosmos"] .lx-saypin{background:transparent}
.lx-morph{position:absolute;inset:0;width:100%;height:100%;display:block;image-rendering:pixelated}
.lx-sayin{position:relative;height:100%;display:flex;flex-direction:column;justify-content:center;pointer-events:none}
.lx-say-k{font-size:14px;font-weight:500;letter-spacing:.02em;color:#b4b4b4;margin-bottom:22px}
.lx-statement{display:grid;max-width:min(640px,47%);font-size:clamp(32px,4.1vw,64px);line-height:1.08;letter-spacing:-.045em;font-weight:300;text-align:left}
.lx-statement .sp{grid-area:1/1;display:block;align-self:start;color:#fff;font-weight:400}
@keyframes lxline{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.lx-statement .w{display:inline-block}
.lx-steps{list-style:none;display:flex;gap:6px;margin-top:40px}
.lx-steps li{width:22px;height:3px;border-radius:2px;background:rgba(245,245,247,.25);transition:background .4s,width .5s var(--e-out)}
.lx-steps li.on{background:#F5F5F7;width:40px}

/* ── Speed ── */
.lx-speed .lx-wrap{display:grid;grid-template-columns:5fr 6fr;gap:64px;align-items:center}
.lx-speed .lx-lead{margin-top:22px;max-width:440px}
.lx-speed .lx-note{margin-top:22px;max-width:440px}
.lx-race{border-radius:30px;padding:18px}
.lx-race-top{display:flex;align-items:flex-end;gap:28px;padding:4px 6px 16px}
.lx-meter span{display:block;font-size:12.5px;color:var(--lx-ink3);margin-bottom:6px}
.lx-watch,.lx-cost{display:block;font-family:var(--mono);font-size:clamp(36px,4vw,56px);letter-spacing:-.05em;font-variant-numeric:tabular-nums;line-height:1;font-weight:400}
.lx-watch.done{color:var(--best)}
.lx-cost{color:var(--up)}
.lx-meter-cost{margin-left:auto;text-align:right}
.lx-race-screen{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:16/10;background:#f4f4f2}
.lx-race-screen canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}
.lx-race-screen img{position:absolute;inset:0;width:100%;height:auto;min-height:100%;object-fit:cover;object-position:50% 0;opacity:0}
/* under the screen: what uxy is doing, then «Gratis» when the page is ready, then the replay (nothing covers the page) */
.lx-race-foot{display:flex;align-items:center;gap:10px;min-height:44px;padding:14px 6px 2px}
.lx-step{display:inline-flex;align-items:center;gap:9px;font-size:14px;color:var(--lx-ink2);white-space:nowrap;min-width:0}
.lx-step .dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--best);animation:lxpulse 1.2s var(--e-io) infinite}
.lx-step.done .dot{background:var(--up);animation:none}
@keyframes lxpulse{50%{transform:scale(.55)}}
.lx-race-foot .lx-paid{margin-left:auto}
.lx-again{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:999px;font-size:13.5px;font-weight:500;color:var(--lx-ink2);background:var(--lx-surf-2);opacity:0;visibility:hidden;transition:color .2s}
.lx-again:hover{color:var(--ink)}
/* «Gratis»: one badge for the lap and the receipt (paid-invoice style: a check that draws, the pill that opens from it) */
.lx-paid{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 13px 0 6px;border-radius:999px;background:#E3F5EC;color:#0A6B44;font-size:14px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;box-shadow:inset 0 0 0 1px rgba(14,159,99,.22);visibility:hidden}
.lx-paid .ck{flex:none;width:18px;height:18px}
.lx-paid .ck circle{fill:#0E9F63}
.lx-paid .ck path{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:12;stroke-dashoffset:0}
.lx-paid .t{display:inline-block}

/* ── The wall: the number, whole, as a scroll scene; then one business changing its look every second ── */
.lx-wall{padding:60px 0 120px}
.lx-num{position:relative;height:200vh}
.lx-num-pin{position:sticky;top:0;height:100vh;overflow:hidden}
.lx-num-h{position:absolute;inset:0;margin:0;font-weight:300}
.lx-count{position:absolute;left:50%;top:50%;translate:-50% -50%;display:inline-block;white-space:nowrap;line-height:.9;letter-spacing:-.055em;font-weight:300;font-variant-numeric:tabular-nums;will-change:transform}
.lx-num-cap{position:absolute;left:50%;top:60%;display:block;width:max-content;max-width:calc(100% - 32px);text-align:center;font-size:clamp(24px,3vw,44px);line-height:1.1;letter-spacing:-.035em;font-weight:300;color:var(--ink);opacity:0;transform:translate3d(-50%,22px,0)}
.lx-wall-head{position:relative;z-index:1;text-align:center;margin-top:-44vh}
.lx-wall-head .lx-lead{margin-top:0}
.lx-sim{display:inline-flex;align-items:center;gap:8px;margin-top:24px;padding:8px 8px 8px 16px;border-radius:999px;font-size:15px;background:var(--lx-surf);border:1px solid var(--lx-line);box-shadow:var(--lx-shadow)}
.lx-sim b{font-weight:500;display:inline-block;min-width:9ch;text-align:left}
.lx-sim-live{width:8px;height:8px;border-radius:50%;background:var(--best)}
.lx-sim-t{color:var(--lx-ink2)}
.lx-sim-open{height:36px;padding:0 14px;border-radius:999px;font-size:13.5px;font-weight:500;background:var(--pill-bg);color:var(--pill-ink)}
.lx-wall-field{position:relative;height:1120px;margin-top:56px;overflow-x:clip;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 5%,#000 86%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 5%,#000 86%,transparent 100%)}
.lx-col{position:absolute;top:0;display:flex;flex-direction:column;gap:20px;will-change:transform}
.lx-tile{position:relative;flex:none;border-radius:14px;overflow:hidden;background:#fff no-repeat 50% 0/100% auto;box-shadow:var(--lx-shadow),0 0 0 1px var(--lx-line);cursor:pointer;transform-origin:50% 50%}
.lx-tile-g{position:absolute;inset:0;background:#fff no-repeat 50% 0/100% auto;transform-origin:50% 0}
/* the digits that are still deciding are pixelated (one SVG filter per digit, #hxPxD{i}, sized every frame) */
.lx-count .d{display:inline-block;text-align:center}
.lx-modal{position:fixed;inset:0;z-index:13}
.lx-modal[hidden]{display:none}
.lx-modal-bg{position:absolute;inset:0;background:rgba(10,12,22,.55)}
.lx-modal-card{position:absolute;left:50%;top:50%;width:min(1240px,calc(100% - 48px));height:min(860px,calc(100% - 64px));transform:translate(-50%,-50%);border-radius:28px;overflow:hidden;background:#fff;box-shadow:0 60px 120px -40px rgba(0,0,0,.6);display:flex;flex-direction:column}
.lx-modal-bar{flex:none;height:60px;display:flex;align-items:center;gap:12px;padding:0 12px 0 22px;background:#16171C;color:#F5F5F7}
.lx-modal-bar b{font-weight:500;font-size:15px;white-space:nowrap}
.lx-modal-bar .lx-ex{color:rgba(245,245,247,.7);border-color:rgba(245,245,247,.25)}
.lx-modal-dev{margin-left:auto;background:rgba(255,255,255,.08)}
.lx-modal-dev .ind{background:#F5F5F7}.lx-modal-dev button{color:rgba(245,245,247,.75);height:30px;font-size:13px}.lx-modal-dev button.on{color:#16171C}
.lx-modal-go{height:38px;padding:0 16px;border-radius:999px;font-size:14px;font-weight:500;background:#F5F5F7;color:#16171C;white-space:nowrap}
.lx-modal-x{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#F5F5F7;background:rgba(255,255,255,.08)}
.lx-modal-frame{position:relative;flex:1;overflow:hidden;background:#f4f4f2}
.lx-modal-frame iframe{position:absolute;top:0;left:0;border:0;transform-origin:0 0;background:#fff;opacity:0}
.lx-modal-ph{position:absolute;inset:0;background:#fff no-repeat 0 0;background-size:100% auto}

/* ── «La forma de manejar tu negocio cambió»: before / now, each row strikes the old way and brings the new one ── */
.lx-now{padding-bottom:40px}
.lx-now .lx-lead{margin-top:24px;max-width:700px}
.lx-shift{list-style:none;margin-top:56px;border-top:1px solid var(--lx-line)}
.lx-shift li{display:grid;grid-template-columns:190px minmax(0,1fr) 34px minmax(0,1.2fr);gap:22px;align-items:center;padding:26px 0;border-bottom:1px solid var(--lx-line)}
.lx-shift .k{font-size:14px;font-weight:500;letter-spacing:.01em;color:var(--best)}
.lx-shift s{position:relative;justify-self:start;text-decoration:none;font-size:clamp(17px,1.45vw,21px);line-height:1.35;letter-spacing:-.015em;color:var(--lx-ink2)}
.lx-shift s::after{content:'';position:absolute;left:-3px;right:-3px;top:52%;height:1.5px;border-radius:1px;background:currentColor;transform-origin:0 50%;transform:scaleX(var(--k,1))}
.lx-shift .ar{width:24px;height:24px;color:var(--lx-ink3)}
.lx-shift .ar svg{width:100%;height:100%;display:block}
.lx-shift b{font-size:clamp(19px,1.9vw,27px);line-height:1.22;font-weight:500;letter-spacing:-.03em}

/* ── uxy: the business runs itself ── */
.lx-uxy{padding-top:170px;padding-bottom:40px}
.lx-uxy-head{max-width:900px}
.lx-uxy-head .lx-lead{margin-top:24px;max-width:640px}
.lx-uxy-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:24px;margin-top:64px;align-items:stretch}
.lx-day{border-radius:30px;padding:20px 22px 18px;min-width:0;height:620px;display:flex;flex-direction:column}
.lx-day-h{flex:none;display:flex;align-items:center;gap:9px;font-size:15px;padding-bottom:14px;border-bottom:1px solid var(--lx-line)}
.lx-day-h b{font-weight:500}
.lx-day-sub{color:var(--lx-ink2)}
.lx-day-clock{margin-left:auto;font-family:var(--mono);font-size:14px;color:var(--lx-ink2);font-variant-numeric:tabular-nums}
.lx-live-dot{width:8px;height:8px;border-radius:50%;background:var(--up)}
.lx-chat{position:relative;flex:1;min-height:0;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 56px);mask-image:linear-gradient(to bottom,transparent 0,#000 56px)}
.lx-chat-in{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:18px;padding:18px 2px 14px;will-change:transform}
.lx-cm{display:flex;flex-direction:column;gap:6px}
.lx-cm .who{margin:0}
.lx-cm .who time{font-family:var(--mono);font-size:12px;color:var(--lx-ink3);font-variant-numeric:tabular-nums}
.lx-cm .msg{max-width:94%}
.lx-cm .st{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.lx-cm .st:empty{display:none}
.lx-cm .msg.me{align-self:flex-end;margin-top:2px}
.lx-cm .chips{margin-top:4px}
.lx-cm .chip{font-size:13px;padding:6px 13px}
.lx-cm .chip.y{background:var(--pill-bg);color:var(--pill-ink);border-color:transparent}
.lx-cs{font-size:12.5px;color:var(--lx-ink3)}
.lx-cs.ok{color:var(--up)}
.lx-chat-comp{flex:none;display:flex;align-items:center;gap:10px;height:48px;padding:0 6px 0 18px;border-radius:999px;border:1px solid var(--lx-line);background:var(--lx-surf);font-size:14.5px;color:var(--lx-ink3);box-shadow:var(--lx-shadow)}
.lx-chat-comp span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lx-chat-comp i{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--pill-bg);color:var(--pill-ink)}
.lx-chat-comp svg{width:16px;height:16px}
.lx-scene{position:relative;min-height:520px;border-radius:30px;overflow:hidden;box-shadow:var(--lx-shadow);background:#2a2a2e}
.lx-scene>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.lx-scene>img.on{opacity:1}
.lx-scene>.lx-ex{position:absolute;top:14px;right:14px;background:rgba(20,22,32,.6);color:#F5F5F7;border-color:rgba(255,255,255,.2)}
.lx-msgs{position:absolute;left:16px;right:16px;bottom:16px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.lx-msg{max-width:92%;font-size:14.5px;line-height:1.42;letter-spacing:-.01em;padding:11px 14px;border-radius:18px;color:#16171C;background:rgba(255,255,255,.94);box-shadow:0 10px 30px -12px rgba(0,0,0,.4)}
.lx-msg .who{display:flex;align-items:center;gap:6px;font-size:11.5px;color:rgba(22,23,28,.6);margin:0 0 3px}
.lx-msg .who .av{width:16px;height:16px;border-radius:50%;background:#16171C;color:#F5F5F7;display:grid;place-items:center}
.lx-msg .who .av svg{width:10px;height:10px}
.lx-msg .acts{display:flex;gap:6px;margin-top:9px}
.lx-msg .acts span{font-size:12.5px;padding:6px 11px;border-radius:999px;border:1px solid rgba(22,23,28,.15)}
.lx-msg .acts span:first-child{background:#16171C;color:#F5F5F7;border-color:transparent}
.lx-areas{border-radius:30px;padding:26px 26px 14px;margin-top:24px}
.lx-areas-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:10px}
.lx-areas-h h3{font-size:20px;font-weight:500;letter-spacing:-.025em}
.lx-areas-h p{font-size:14px;color:var(--lx-ink3)}
.lx-area{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,400px);gap:20px;align-items:center;padding:14px 0;border-top:1px solid var(--lx-line)}
.lx-area b{display:block;font-size:16px;font-weight:500}
.lx-area small{display:block;font-size:13.5px;color:var(--lx-ink3);margin-top:2px}
.lx-uxy .lx-h3{margin-top:110px}
/* uxy's marketing team: Google, Meta and the plan, each with a live example on top */
.lx-team-lead{margin-top:16px;max-width:660px}
.lx-team{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px;perspective:1200px}
.lx-tm{--art:260px;position:relative;border-radius:28px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.lx-tm>.lx-ex{position:absolute;top:calc(var(--art) + 33px);right:22px;z-index:2}
.lx-tm-art{position:relative;height:var(--art);margin:10px 10px 0;border-radius:20px;background:var(--lx-tile);overflow:hidden;padding:20px 18px;display:flex;flex-direction:column;justify-content:center;gap:9px}
.lx-tm-art>*{flex:none}
.lx-rev .tx{display:block}   /* never squeezed: the reply typed into two lines was pressed against its bottom edge (operator 2026-10-08) */
.lx-tm-b{padding:20px 22px 24px}
.lx-tm-b h4{font-size:20px;font-weight:500;letter-spacing:-.025em}
.lx-tm-b ul{list-style:none;display:grid;gap:9px;margin-top:14px;font-size:15px;line-height:1.4;color:var(--lx-ink2)}
.lx-tm-b li{display:flex;gap:10px;align-items:flex-start}
.lx-tm-b li::before{content:'';flex:none;width:16px;height:16px;margin-top:2px;border-radius:50%;background:var(--best) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center/11px no-repeat}
.lx-gplace,.lx-rev,.lx-ad,.lx-tm .lx-plan{background:#fff;color:#16171C;box-shadow:0 10px 26px -14px rgba(20,30,60,.4),0 0 0 1px rgba(22,23,28,.05)}
.lx-gplace{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:14px;font-size:13.5px}
.lx-gplace .g{width:20px;height:20px;flex:none}.lx-gplace .g svg{width:100%;height:100%;display:block}
.lx-gplace b{font-weight:600;white-space:nowrap;min-width:0}
.lx-gplace .stars{margin-left:auto;color:#F2A60C;font-size:12px;white-space:nowrap;letter-spacing:.04em}.lx-gplace .stars em{font-style:normal;color:#16171C;font-weight:600;margin-left:3px;letter-spacing:0}
.lx-rev{font-size:13px;line-height:1.45;padding:10px 12px;border-radius:14px}
.lx-rev .who{display:flex;align-items:center;gap:6px;font-size:11.5px;color:rgba(22,23,28,.55);margin-bottom:3px}
.lx-rev.reply{margin-left:26px;background:#16171C;color:#F5F5F7;min-height:62px}
.lx-rev.reply .who{color:rgba(245,245,247,.62)}
.lx-tm .av{width:15px;height:15px;border-radius:50%;flex:none;display:grid;place-items:center;background:#F5F5F7;color:#16171C}
.lx-tm .av svg{width:9px;height:9px}
.lx-rev .tx.typing::after{content:'';display:inline-block;width:1.5px;height:1em;margin-left:1px;vertical-align:-.15em;background:currentColor;animation:lxcaret 1s steps(1) infinite}
.lx-ad{width:min(240px,100%);margin:0 auto;border-radius:14px;overflow:hidden;font-size:12px}
.lx-ad-h{display:flex;align-items:center;gap:7px;padding:8px 10px}
.lx-ad-h .pf{width:20px;height:20px;border-radius:50%;background:url('media/people-icecream-sm.jpg') 55% 25%/300% no-repeat;box-shadow:0 0 0 1.5px #fff,0 0 0 2.5px #E4405F}
.lx-ad-h b{font-weight:600}.lx-ad-h small{color:rgba(22,23,28,.5);font-size:11px;margin-left:auto}
.lx-ad-img{height:92px;background:center 32%/cover no-repeat}
.lx-ad-c{padding:8px 10px 4px;line-height:1.35}
.lx-ad-k{display:flex;gap:12px;padding:3px 10px 10px;color:rgba(22,23,28,.6)}
.lx-ad-k b{color:#16171C;font-weight:600;font-variant-numeric:tabular-nums}
.lx-meta{position:absolute;right:14px;top:14px;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink)}
.lx-meta svg{width:22px;height:22px}
.lx-plan{border-radius:14px;padding:12px 14px;font-size:12.5px;display:grid;gap:9px}
.lx-plan-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.lx-plan-h b{font-size:13.5px;font-weight:600}.lx-plan-h small{color:rgba(22,23,28,.5)}
.lx-goal{display:grid;gap:5px;line-height:1.3}
.lx-goal i{display:block;height:6px;border-radius:4px;background:rgba(22,23,28,.08);position:relative;overflow:hidden}
.lx-goal i::after{content:'';position:absolute;left:0;top:0;bottom:0;width:calc(var(--p) * 100%);border-radius:inherit;background:var(--best);transform-origin:0 50%;transform:scaleX(var(--k,1))}
.lx-plan-t{display:flex;gap:7px;align-items:center;font-size:12px;line-height:1.35;padding:7px 9px;border-radius:10px;background:#ededed;color:#323232}
.lx-plan-t .av{background:#16171C;color:#F5F5F7}
/* Rubro playbooks (playbooks.json): what uxy starts with, per kind of business */
.lx-pb{border-radius:30px;padding:24px 26px 22px;margin-top:36px}
.lx-pb-tabs{display:flex;flex-wrap:wrap;gap:8px}
.lx-pb-tabs button{height:36px;padding:0 15px;border-radius:999px;font-size:14px;color:var(--lx-ink2);background:var(--lx-surf-2);transition:background .25s,color .25s}
.lx-pb-tabs button:hover{color:var(--ink)}
.lx-pb-tabs button.on{background:var(--pill-bg);color:var(--pill-ink)}
.lx-pb-ex{margin-top:18px;font-size:14px;color:var(--lx-ink3);min-height:1.4em}
.lx-pb-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;margin-top:18px;min-height:220px}
.lx-pb-col h4{font-size:13.5px;font-weight:600;letter-spacing:.01em;color:var(--lx-ink3)}
.lx-pb-col ul{list-style:none;display:grid;gap:11px;margin-top:12px;font-size:15px;line-height:1.42}
.lx-pb-col li{position:relative;padding-left:16px}
.lx-pb-col li::before{content:'';position:absolute;left:0;top:.56em;width:6px;height:6px;border-radius:50%;background:var(--best)}
.lx-pb-sum li::before{background:var(--up)}
.lx-pb-col em{font-style:normal;color:var(--best)}
.lx-pb-when{margin-top:22px;padding-top:16px;border-top:1px solid var(--lx-line);font-size:14px;line-height:1.5;color:var(--lx-ink2)}
.lx-pb-when b{font-weight:500;color:var(--ink)}
.lx-ads-n{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.lx-ads-n span{display:block;font-size:12.5px;color:var(--lx-ink3)}
.lx-ads-n b{display:block;font-size:46px;line-height:1;letter-spacing:-.05em;font-weight:300;font-variant-numeric:tabular-nums;margin-top:6px}
.lx-ads-n small{display:block;font-size:12px;line-height:1.35;color:var(--lx-ink3);margin-top:6px}
.lx-data{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:36px}
.lx-dc{position:relative;border-radius:24px;padding:20px 20px 22px;min-width:0}
.lx-dc h4{font-size:15px;font-weight:500;letter-spacing:-.015em;padding-right:64px}
.lx-dc>.lx-ex{position:absolute;top:18px;right:16px}
.lx-dc p{font-size:13.5px;line-height:1.45;color:var(--lx-ink3);margin-top:12px}
.lx-bars-h{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.lx-bars-h div{display:grid;grid-template-columns:76px 1fr 40px;gap:10px;align-items:center;font-size:13px}
.lx-bars-h i{display:block;height:8px;border-radius:6px;background:var(--best);width:calc(var(--w) * 100%);transform-origin:0 50%}
.lx-bars-h div:nth-child(2) i{background:#757575}.lx-bars-h div:nth-child(3) i{background:var(--up)}
.lx-bars-h b{font-weight:500;text-align:right;font-variant-numeric:tabular-nums}
.lx-big-n{font-size:56px;line-height:1;letter-spacing:-.05em;font-weight:300;margin-top:16px}
.lx-big-n b{font-weight:400;font-variant-numeric:tabular-nums}
.lx-q{list-style:none;display:flex;flex-direction:column;gap:7px;margin-top:16px}
.lx-q li{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px;padding:7px 10px;border-radius:10px;background:var(--lx-surf-2)}
.lx-q b{font-size:11.5px;color:var(--up);font-weight:600}
.lx-hours{display:flex;align-items:flex-end;gap:3px;height:84px;margin-top:18px}
.lx-hours i{flex:1;border-radius:3px 3px 0 0;background:var(--lx-surf-2);transform-origin:50% 100%}
.lx-hours i.hot{background:var(--best)}

/* ── Made for your business: a compact bento (the trade, the phone, being found) ── */
.lx-cover{padding-top:100px}
.lx-bento{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);grid-template-rows:auto auto;gap:20px;margin-top:48px}
.lx-bt{position:relative;border-radius:30px;overflow:hidden;min-width:0;display:flex}
.lx-bt-b{padding:28px 30px}
.lx-bt-b h3{font-size:clamp(24px,2.3vw,32px);line-height:1.08;letter-spacing:-.04em;font-weight:400}
.lx-bt-b p{font-size:clamp(15px,1.15vw,17px);line-height:1.5;color:var(--lx-ink2);margin-top:12px;max-width:460px}
.lx-bt-rubro{grid-column:1;grid-row:1;align-items:center}
.lx-bt-rubro .lx-art{flex:none;width:clamp(200px,22vw,280px);margin:12px 0 12px 12px;border-radius:22px;box-shadow:none}
.lx-bt-phone{grid-column:2;grid-row:1 / span 2;flex-direction:column}
.lx-bt-phone .lx-phoneart{position:relative;flex:1;min-height:440px;margin:0 12px 12px;border-radius:22px;overflow:hidden;background:var(--lx-tile)}
.lx-bt-phone .lx-phone{position:absolute;left:50%;top:34px;height:calc(100% - 68px);translate:-50% 0}
.lx-bt-serp{grid-column:1;grid-row:2;align-items:center}
.lx-bt-serp .lx-serp{position:relative;flex:none;width:clamp(240px,25vw,320px);align-self:stretch;margin:12px 0 12px 12px;border-radius:22px}
.lx-serp>.lx-ex{position:absolute;top:12px;right:12px;z-index:2}
.lx-bt-serp .lx-serp{padding-top:46px}
.lx-art{position:relative;aspect-ratio:1;border-radius:30px;overflow:hidden;background:var(--lx-tile);box-shadow:var(--lx-shadow)}
.lx-art>img{width:100%;height:100%;object-fit:cover;display:block;will-change:transform}
.lx-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.lx-chip{display:inline-flex;align-items:center;gap:8px;font-size:14px;padding:8px 14px 8px 10px;border-radius:999px;border:1px solid var(--line-2);background:var(--lx-surf)}
.lx-chip svg{width:17px;height:17px;flex:none}
/* ── A phone that reads as a phone: titanium band, black bezel, the island, a status bar in the page's own color, the side
   buttons and the home bar. Sized in cqw of the device, so the bento phone and the wall phone are the same object. The
   chrome (bar, buttons, home bar) is added by phoneChrome() in landing.js, so the Markdown twin never reads «9:41». ── */
.lx-phone{position:relative;container-type:inline-size;aspect-ratio:71.6/147.6}
.lx-phone-fr{position:absolute;inset:0;z-index:1;border-radius:16cqw;padding:1cqw;background:linear-gradient(150deg,#73767e 0%,#2e3035 13%,#15161a 48%,#2e3035 87%,#6b6e76 100%);box-shadow:inset 0 0 0 .3cqw rgba(255,255,255,.18),0 50px 80px -34px rgba(12,18,40,.55),0 18px 34px -20px rgba(12,18,40,.42)}
.lx-phone-in{position:relative;height:100%;display:flex;flex-direction:column;border-radius:15cqw;border:2.7cqw solid #060607;background:#060607;overflow:hidden}
.lx-phone-sb{position:relative;z-index:30;flex:none;height:12cqw;display:grid;grid-template-columns:1fr 30cqw 1fr;align-items:center;padding-top:.6cqw;font:600 4cqw/1 -apple-system,'SF Pro Text',Inter,system-ui,sans-serif;letter-spacing:-.01em;color:#101114;background:#fff;transition:background-color .35s,color .35s}
.lx-phone-sb b{justify-self:center;font-weight:600}
.lx-phone-sb .ic{grid-column:3;justify-self:center;display:flex;align-items:center;gap:1.3cqw}
.lx-phone-sb svg{height:2.9cqw;width:auto;fill:currentColor;display:block}
.lx-phone-sb::after{content:'';position:absolute;left:50%;top:2.3cqw;width:29cqw;height:8.4cqw;margin-left:-14.5cqw;border-radius:9cqw;background:#000}
.lx-phone-vp{position:relative;flex:1;overflow:hidden;background:#fff}
.lx-phone-vp img{position:absolute;left:0;top:0;width:100%;height:auto;display:block;will-change:transform}
.lx-phone-home{position:absolute;z-index:30;left:50%;bottom:1.7cqw;width:34cqw;height:1.25cqw;margin-left:-17cqw;border-radius:1cqw;background:currentColor;opacity:.82;color:#101114;transition:color .35s}
.lx-pbtn{position:absolute;z-index:0;width:1.3cqw;background:linear-gradient(90deg,#2a2c31,#6a6d75 55%,#34363c)}
.lx-pbtn.l{left:-.85cqw;border-radius:.9cqw 0 0 .9cqw}
.lx-pbtn.r{right:-.85cqw;border-radius:0 .9cqw .9cqw 0}
.lx-serp{display:flex;flex-direction:column;justify-content:center;gap:14px;padding:22px;background:linear-gradient(180deg,#F7F8FB,#EEF1F6)}
.lx-serp-bar{display:flex;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:20px;background:#fff;color:#16171C;font-size:13.5px;box-shadow:0 4px 14px -6px rgba(20,30,60,.25)}
.lx-serp-r{display:flex;flex-direction:column;gap:3px;padding:14px;border-radius:14px;background:#fff;color:#16171C;font-size:13px;box-shadow:0 4px 14px -6px rgba(20,30,60,.2)}
.lx-serp-r small{color:#3a6b35;font-size:12px}.lx-serp-r b{color:#1a3fbf;font-weight:500;font-size:15px}.lx-serp-r span{color:#4a4d57}
.lx-serp-ai{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:14px;background:#16171C;color:#F5F5F7;font-size:13px;line-height:1.45}
.lx-serp-tag{font-size:11px;color:#b4b4b4;font-weight:500}

/* ── How to ask for it: three live cards ── */
.lx-how .lx-head{text-align:center;max-width:720px;margin:0 auto}
.lx-how .lx-lead{margin-top:16px}
.lx-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:56px;perspective:1200px}
.lx-try{display:flex;flex-direction:column;text-align:left;border-radius:28px;overflow:hidden;transform-style:preserve-3d}
.lx-try>span{display:block}
.lx-try .lx-mini{position:relative;height:230px;margin:10px 10px 0;border-radius:20px;background:var(--lx-tile);overflow:hidden}
.lx-try .lx-tb{padding:20px 22px 24px}
.lx-try b{display:block;font-size:20px;font-weight:500;letter-spacing:-.025em}
.lx-try .lx-tt{display:block;font-size:15px;line-height:1.45;color:var(--lx-ink2);margin-top:6px}
.lx-try .lx-tc{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:500;color:var(--ink);margin-top:14px}
.lx-mfield{position:absolute;left:16px;right:16px;top:50%;margin-top:-26px;height:52px;border-radius:26px;background:var(--lx-field);box-shadow:inset 0 0 0 1px var(--lx-field-line),0 12px 26px -14px rgba(0,0,0,.35);display:flex;align-items:center;padding:0 8px 0 18px;font-size:14px;gap:8px}
.lx-mfield .tx{flex:1;min-width:0;white-space:nowrap;overflow:hidden;color:var(--ink)}
.lx-mfield .tx::after{content:'';display:inline-block;width:1.5px;height:1.05em;background:var(--ink);vertical-align:-.15em;margin-left:1px;animation:lxcaret 1s steps(1) infinite}
@keyframes lxcaret{50%{opacity:0}}
.lx-mfield .sd{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--lx-surf-2);color:var(--lx-ink3);transition:background .25s,color .25s}
.lx-mfield .sd.ok{background:var(--pill-bg);color:var(--pill-ink)}
.lx-murl{position:absolute;left:16px;right:16px;top:16px;height:40px;border-radius:20px;background:var(--lx-field);box-shadow:inset 0 0 0 1px var(--lx-field-line);display:flex;align-items:center;gap:8px;padding:0 14px;font-size:13.5px;color:var(--lx-ink2);z-index:2}
.lx-murl svg{flex:none;color:var(--lx-ink3)}
.lx-murl .tx{white-space:nowrap;overflow:hidden}
.lx-mpage{position:absolute;left:16px;right:16px;top:66px;bottom:-30px;border-radius:12px 12px 0 0;overflow:hidden;background:#fff;box-shadow:0 10px 30px -12px rgba(0,0,0,.3)}
.lx-mpage img{width:100%;height:auto;display:block}
.lx-slot{position:absolute;left:16px;right:16px;top:50%;height:52px;margin-top:-26px;border-radius:26px;background:var(--lx-field);box-shadow:inset 0 0 0 1px var(--lx-field-line),0 12px 26px -14px rgba(0,0,0,.35);display:flex;align-items:center;gap:8px;padding:0 8px 0 18px;overflow:hidden}
.lx-slot .win{flex:1;height:52px;overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent);mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent)}
.lx-slot .reel{position:absolute;left:0;right:0;top:0}
.lx-slot .reel span{display:block;height:52px;line-height:52px;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lx-slot .spin{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--lx-surf-2);color:var(--ink)}

/* ── Free: the question, the «Sí.», and the receipt that adds up to zero ── */
.lx-free{text-align:center}
.lx-free .lx-q{display:block;font-size:clamp(24px,2.6vw,36px);letter-spacing:-.03em;color:var(--ink);font-weight:400;min-height:1.3em}
.lx-yes{display:block;font-size:clamp(120px,20vw,300px);line-height:.85;letter-spacing:-.07em;font-weight:300;margin-top:10px;clip-path:inset(-40% -10% -6% -10%)}   /* the mask the «Sí.» rises through (room for the accent) */
.lx-yes>span{display:inline-block}
.lx-free .lx-q .caret{display:inline-block;width:2px;height:.95em;margin-left:2px;vertical-align:-.12em;background:var(--ink);animation:lxcaret 1s steps(1) infinite}
.lx-receipt{position:relative;width:min(520px,100%);margin:44px auto 0;text-align:left;padding:24px 26px 22px;border-radius:22px;background:#FFFFFF;color:#16171C;box-shadow:0 40px 70px -30px rgba(0,0,0,.4),0 0 0 1px rgba(22,23,28,.06);font-size:15px}
.lx-receipt .r-h{display:flex;align-items:center;gap:8px;font-weight:500;padding-bottom:14px;border-bottom:1.5px dashed rgba(22,23,28,.18);margin-bottom:6px}
.lx-receipt .r-h .hx-h{font-weight:700}
.lx-receipt .r-h .lx-paid{margin-left:auto}
.lx-receipt .r-row,.lx-receipt .r-tot{display:flex;align-items:baseline;gap:10px;padding:10px 0}
.lx-receipt .r-row span{color:rgba(22,23,28,.72);min-width:0}
.lx-receipt .r-lead{flex:1;min-width:16px;border-bottom:1.5px dotted rgba(22,23,28,.26);transform-origin:0 50%;translate:0 -4px}
.lx-receipt b{font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.lx-receipt .r-tot{justify-content:space-between;border-top:1.5px dashed rgba(22,23,28,.18);margin-top:6px;padding-top:16px}
.lx-receipt .r-tot span{font-weight:500}
.lx-receipt .r-big{font-family:var(--mono);font-size:34px;letter-spacing:-.04em;clip-path:inset(-10% -4% -10% -4%)}
.lx-receipt .r-big>span{display:inline-block}
.lx-pro{max-width:620px;margin:40px auto 0;border-radius:28px;padding:26px 28px;text-align:left}
.lx-pro h3{font-size:19px;font-weight:500;letter-spacing:-.025em;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.lx-pro h3 em{font-style:normal;font-size:12px;font-weight:500;color:var(--best);border:1px solid color-mix(in srgb,var(--best) 45%,transparent);border-radius:999px;padding:2px 8px}
.lx-pro ul{list-style:none;display:grid;gap:10px;margin-top:16px;font-size:16px;color:var(--lx-ink2)}
.lx-pro li{display:flex;gap:10px;align-items:flex-start}
.lx-pro li svg{color:var(--best);flex:none;margin-top:3px}

/* ── Questions ── */
.lx-faq{max-width:780px;margin:56px auto 0;display:flex;flex-direction:column;gap:10px}
.lx-faq details{border-radius:20px;padding:0 22px}
.lx-faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;font-size:clamp(17px,1.4vw,19px);letter-spacing:-.02em}
.lx-faq summary::-webkit-details-marker{display:none}
.lx-faq summary i{flex:none;width:22px;height:22px;position:relative;transition:transform .45s var(--e-out)}
.lx-faq summary i::before,.lx-faq summary i::after{content:'';position:absolute;left:4px;right:4px;top:10px;height:1.6px;border-radius:1px;background:var(--lx-ink2)}
.lx-faq summary i::after{transform:rotate(90deg)}
.lx-faq details[open] summary i{transform:rotate(45deg)}
.lx-faq details p{padding:0 0 22px;font-size:16px;line-height:1.55;color:var(--lx-ink2);max-width:660px}

/* ── Footer ── */
.lx-foot{padding:150px 0 0;text-align:center}
.lx-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 34px;font-size:clamp(22px,2.4vw,32px);letter-spacing:-.035em;font-weight:300}
.lx-links a,.lx-links button{color:var(--ink);transition:opacity .2s}
.lx-links a:hover,.lx-links button:hover{opacity:.6}
.lx-wordmark{display:block;font-weight:600;letter-spacing:-.065em;line-height:.86;white-space:nowrap;margin:80px 0 0;font-size:24vw;padding-bottom:.24em;margin-bottom:-.16em;overflow:hidden}   /* the padding keeps the descenders of y and p inside the mask */
.lx-wordmark span{display:inline-block}
.lx-legal{position:relative;z-index:1;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:22px 0 110px;font-size:13px;color:var(--lx-ink3)}   /* above the wordmark's letters, whose transforms paint over it and took every click on desktop */
.lx-legal-links{display:flex;flex-wrap:wrap;gap:6px 18px}.lx-legal-links a{color:var(--lx-ink2)}.lx-legal-links a:hover{color:var(--ink)}

/* ── Variant switcher (?dev=1) ── */
.lx-dev{position:fixed;left:16px;bottom:16px;z-index:12;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--lx-ink3);padding:6px 6px 6px 12px;border-radius:999px;background:var(--lx-surf);border:1px solid var(--lx-line)}
.lx-dev .lx-seg{padding:3px}.lx-dev .lx-seg button{height:28px;padding:0 12px;font-size:12px}

/* ── The send: the field travels to the chat ── */
.lx-flip{position:fixed;z-index:20;margin:0;pointer-events:none;display:flex;align-items:center;padding:0 20px;overflow:hidden;font-size:16px;color:var(--ink);background:var(--glass);border:1px solid var(--line);white-space:nowrap}

/* ── Cosmos (optional background): deep space behind everything ── */
.cosmos{position:fixed;inset:0;z-index:1;width:100%;height:100%;display:none;pointer-events:none}
body[data-bg="cosmos"]{background:#060606}
body[data-bg="cosmos"] .cosmos{display:block}
body[data-bg="cosmos"] .sky{background:#060606}
body[data-bg="cosmos"] .sky .shade{display:none}

@media (max-width:900px){
  .landing{--lx-gut:16px}
  .lx-sec{padding:96px 0}
  .lx-hero{padding-top:104px}
  .lx-show>.lx-composer{top:-28px;left:12px;right:12px}
  .lx-show{margin-top:64px}
  .lx-screen{aspect-ratio:4/5}
  .lx-film-ui{left:12px;right:12px;bottom:12px;flex-direction:column-reverse;align-items:flex-start;gap:8px}
  .lx-said{max-width:100%;font-size:14px}
  .lx-tag{font-size:14px;height:38px}
  .lx-composer{height:56px;padding-left:18px}
  .lx-composer input,.lx-composer .lx-ph{font-size:16px}
  .lx-composer .lx-ph{left:18px;right:92px}
  .lx-surp,.lx-send{width:40px;height:40px}
  .lx-saysec{height:480vh;margin-top:80px}
  .lx-sayin{justify-content:flex-end;padding-bottom:12vh}
  .lx-statement{max-width:100%;font-size:clamp(30px,8.6vw,44px)}
  .lx-say-k{margin-bottom:14px}
  .lx-speed .lx-wrap,.lx-uxy-grid{grid-template-columns:1fr;gap:28px}
  .lx-race-top{gap:16px}
  .lx-num{height:190vh}
  .lx-wall-field{height:860px;margin-top:40px}
  .lx-day{height:540px}
  .lx-sim{font-size:14px}
  .lx-area{grid-template-columns:1fr;gap:10px}
  .lx-seg button{padding:0 8px;font-size:13px}
  .lx-data{grid-template-columns:1fr 1fr;gap:12px}
  .lx-team{grid-template-columns:1fr;gap:14px;margin-top:28px}
  .lx-shift{margin-top:36px}
  .lx-shift li{grid-template-columns:1fr;gap:6px;padding:20px 0}
  .lx-shift .ar{display:none}
  .lx-pb{padding:18px 16px 18px}
  .lx-pb-grid{grid-template-columns:1fr 1fr;gap:20px}
  .lx-tm{--art:292px}
  .lx-step{flex-basis:100%}
  .lx-race-foot{flex-wrap:wrap;row-gap:10px}
  .lx-race-foot .lx-paid{margin-left:0}
  .lx-again{margin-left:auto;white-space:nowrap}
  .lx-cover{padding-top:80px}
  .lx-bento{grid-template-columns:1fr;gap:14px;margin-top:32px}
  .lx-bt-rubro,.lx-bt-phone,.lx-bt-serp{grid-column:1;grid-row:auto;flex-direction:column;align-items:stretch}
  .lx-bt-rubro .lx-art,.lx-bt-serp .lx-serp{width:auto;margin:10px 10px 0}
  .lx-bt-rubro .lx-art{aspect-ratio:16/10}
  .lx-bt-b{padding:22px 22px 24px}
  .lx-cards{grid-template-columns:1fr;gap:14px}
  .lx-legal{justify-content:center}
  .lx-modal-card{width:calc(100% - 16px);height:calc(100% - 24px);border-radius:22px}
  .lx-modal-bar{gap:8px;padding:0 8px 0 14px}.lx-modal-bar .lx-ex,.lx-modal-dev{display:none}
  .landing[data-v="c"] .lx-fieldwrap{aspect-ratio:4/5}
  .landing[data-v="c"] .lx-show>.lx-composer{bottom:16px}
}
@media (max-width:560px){ .lx-data{grid-template-columns:1fr} .lx-scene{min-height:460px} .lx-pb-grid{grid-template-columns:1fr} .lx-pb-tabs button{height:34px;padding:0 13px;font-size:13.5px} }
@media (prefers-reduced-motion:reduce){.lx-mfield .tx::after{animation:none}.lx-statement .sp:not(.now){visibility:hidden}}
/* over the dark stage of the statement, the dock and the top bar turn dark too (light glass over it read gray) */
.lx-dock.dark,.lx-top.dark{--ink:#F5F5F7;--lx-ink2:rgba(245,245,247,.82);--lx-ink3:rgba(245,245,247,.55);--lx-surf-2:rgba(255,255,255,.08);--glass:rgba(18,18,18,.72);--line:rgba(255,255,255,.1);--pill-bg:#F5F5F7;--pill-ink:#16171C;--lx-field-line:rgba(255,255,255,.12);color:#F5F5F7}
/* ── P13 (Fase F): autonomy with orbs, marks and a color per position; the rubros; uxy's day as cards; the receipt ── */
.lx-orb{width:38px;height:38px;border-radius:50%;flex:none;background:radial-gradient(90% 90% at 30% 24%,rgba(255,255,255,.55),transparent 42%),linear-gradient(140deg,var(--o1),var(--o2));box-shadow:inset 0 -3px 6px rgba(0,0,0,.16),0 8px 18px -10px var(--o2);transition:filter .35s}
.lx-orb.sm{width:22px;height:22px;box-shadow:inset 0 -2px 4px rgba(0,0,0,.16)}
.lx-area{grid-template-columns:38px minmax(0,1fr) minmax(300px,380px)}
.lx-area-t b{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lx-logos{display:inline-flex;align-items:center;gap:6px;margin-left:2px}.lx-logos svg{width:22px;height:22px;display:block;flex:none}   /* the real marks (simple-icons), big enough to read */
.lx-soon{font-style:normal;font-size:11px;font-weight:500;letter-spacing:.01em;padding:3px 8px;border-radius:999px;background:var(--lx-surf-2);color:var(--lx-ink2)}
.lx-area[data-mode="off"] .lx-orb{filter:grayscale(1) brightness(1.05)}
.lx-area[data-mode="ask"] .lx-seg .ind{background:#F2C14E}.lx-area[data-mode="ask"] .lx-seg button.on{color:#2A1F00}
.lx-area[data-mode="auto"] .lx-seg .ind{background:#18A660}.lx-area[data-mode="auto"] .lx-seg button.on{color:#fff}
.lx-area[data-mode="off"] .lx-seg .ind{background:var(--lx-ink3)}.lx-area[data-mode="off"] .lx-seg button.on{color:var(--canvas,#fff)}
.lx-area .lx-seg .ind{transition:background-color .35s}
@media (max-width:760px){.lx-area{grid-template-columns:38px minmax(0,1fr)}.lx-area .lx-seg{grid-column:1/-1}}
.lx-ex-soon{color:var(--lx-ink2);background:var(--lx-surf)}
.lx-pb-tabs button svg{width:16px;height:16px;margin-right:6px;vertical-align:-3px}
.lx-pb-grid.lx-pb3{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;min-height:0}
.lx-pb-card{border-radius:22px;background:var(--lx-surf-2);padding:18px 18px 16px}
.lx-pb-card h4{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink)}
.lx-pb-card ul{list-style:none;display:grid;gap:10px;margin-top:14px;font-size:15px;line-height:1.35}
.lx-pb-mods li,.lx-pb-auto li{display:flex;align-items:center;gap:10px}
.lx-pb-mods .i{width:32px;height:32px;flex:none;border-radius:10px;display:grid;place-items:center;background:var(--lx-surf);color:var(--best)}.lx-pb-mods .i svg{width:17px;height:17px}
.lx-pb-auto .m{margin-left:auto;font-style:normal;font-size:12px;font-weight:500;padding:3px 9px;border-radius:999px}
.lx-pb-auto .m.auto{background:rgba(24,166,96,.14);color:#12804A}.lx-pb-auto .m.ask{background:rgba(242,193,78,.22);color:#8A6200}.lx-pb-auto .m.off{background:var(--lx-surf);color:var(--lx-ink3)}
.lx-pb-sum li{position:relative;padding-left:16px}.lx-pb-sum li::before{content:'';position:absolute;left:0;top:.5em;width:6px;height:6px;border-radius:50%;background:var(--up)}
.lx-pb-note{margin-top:12px;font-size:13px;color:var(--lx-ink3)}
@media (max-width:900px){.lx-pb-grid.lx-pb3{grid-template-columns:1fr}}
.lx-k{border-radius:16px;background:var(--lx-surf);border:1px solid var(--lx-line);padding:12px 14px;font-size:14.5px;line-height:1.38;max-width:96%}
.lx-k b{font-weight:600}
.lx-k-reply .q{color:var(--lx-ink2)}.lx-k-reply .q b{color:var(--ink);margin-right:6px}
.lx-k-reply .a{display:flex;gap:8px;align-items:flex-start;margin-top:8px;padding:9px 11px;border-radius:12px 12px 12px 4px;background:rgba(37,211,102,.12)}
.lx-k-reply .a svg,.lx-k-order .h svg{width:18px;height:18px;flex:none;margin-top:1px}
.lx-k-order .h{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.lx-k-order .l,.lx-k-order .t{display:flex;justify-content:space-between;gap:12px;font-variant-numeric:tabular-nums}.lx-k-order .l{color:var(--lx-ink2)}
.lx-k-order .t{margin-top:6px;padding-top:6px;border-top:1px dashed var(--lx-line);color:var(--lx-ink2)}.lx-k-order .t b{color:var(--ink)}
.lx-k-book{display:flex;gap:12px;align-items:center}.lx-k-book .cal{flex:none;width:58px;border-radius:12px;overflow:hidden;text-align:center;border:1px solid var(--lx-line)}
.lx-k-book .cal small{display:block;font-size:11px;padding:3px 0;background:var(--best);color:#fff}.lx-k-book .cal b{display:block;padding:5px 0;font-size:15px;font-variant-numeric:tabular-nums}
.lx-k-book span{display:block;color:var(--lx-ink2)}
.lx-k-vis{display:flex;gap:14px;align-items:center}.lx-k-vis .n b{font-size:26px;font-weight:600;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.lx-k-vis .n small{color:var(--lx-ink3);margin-left:2px}
.lx-k-vis .m{flex:1;min-width:0}.lx-k-vis .m span{display:block;color:var(--lx-ink2)}.lx-k-vis i{display:block;height:6px;border-radius:999px;background:var(--lx-surf-2);margin-top:7px;overflow:hidden}.lx-k-vis i em{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#5B8CFF,#3DDC97);transition:width .9s cubic-bezier(.16,1,.3,1)}
.lx-k-page{display:flex;gap:12px;align-items:center}.lx-k-page .plus{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--best);color:#fff;font-weight:600}.lx-k-page span{display:block;color:var(--lx-ink2)}
.lx-k-sum{display:grid;gap:4px}.lx-k-sum span::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--up);margin-right:8px;vertical-align:2px}
.lx-receipt .r-sum b s{text-decoration-thickness:2px;color:var(--lx-ink3)}
.lx-receipt .r-src{margin-top:12px;font-size:11.5px;line-height:1.45;color:rgba(22,23,28,.5)}
.lx-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:28px}
.lx-plan{border-radius:22px;padding:18px 18px 16px}.lx-plan b{display:block;font-size:15px;font-weight:600}
.lx-plan .p{display:block;margin-top:6px;font-size:26px;font-weight:600;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.lx-plan .p small{font-size:13px;font-weight:500;color:var(--lx-ink3);margin-left:2px}
.lx-plan ul{list-style:none;display:grid;gap:7px;margin-top:12px;font-size:14px;line-height:1.35;color:var(--lx-ink2)}
.lx-plan.hl{box-shadow:0 0 0 1.5px var(--best) inset}
.lx-plans-n{margin-top:14px;text-align:center;font-size:13.5px;color:var(--lx-ink3)}
@media (max-width:900px){.lx-plans{grid-template-columns:minmax(0,1fr);max-width:560px;margin-inline:auto}}

/* The landing's cards in the dark (the cosmos, the night sky): the same cards on a dark surface (operator 2026-10-08:
   «todas esas tarjetas no tienen dark mode»). The pages themselves (tiles, the phone, the preview) stay as they are. */
body[data-ui="dark"] .lx-receipt{background:#171717;color:#F5F5F7;box-shadow:0 40px 70px -30px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.08)}
body[data-ui="dark"] .lx-receipt :is(.r-h,.r-tot){border-color:rgba(255,255,255,.14)}
body[data-ui="dark"] .lx-receipt .r-row span{color:rgba(245,245,247,.66)}
body[data-ui="dark"] .lx-receipt .r-lead{border-color:rgba(255,255,255,.2)}
body[data-ui="dark"] .lx-receipt .r-src{color:rgba(245,245,247,.5)}
body[data-ui="dark"] :is(.lx-gplace,.lx-rev:not(.reply),.lx-ad,.lx-tm .lx-plan,.lx-said,.lx-serp-bar,.lx-serp-r){background:#191919;color:#F5F5F7;box-shadow:0 10px 26px -14px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.08)}
body[data-ui="dark"] .lx-gplace .stars em{color:#F5F5F7}
body[data-ui="dark"] :is(.lx-rev .who,.lx-said small,.lx-plan-h small){color:rgba(245,245,247,.55)}
body[data-ui="dark"] .lx-rev.reply{background:#F5F5F7;color:#16171C}body[data-ui="dark"] .lx-rev.reply .who{color:rgba(22,23,28,.55)}
body[data-ui="dark"] .lx-plan-t{background:rgba(123,123,123,.16);color:#dfdfdf}
body[data-ui="dark"] :is(.lx-plan-t .av,.lx-said .av){background:#F5F5F7;color:#16171C}
body[data-ui="dark"] .lx-msg{background:rgba(26,26,26,.94);color:#F5F5F7}
body[data-ui="dark"] .lx-serp-r small{color:#86C77F}body[data-ui="dark"] .lx-serp-r b{color:#93B1FF}body[data-ui="dark"] .lx-serp-r span{color:#B9BCC8}

/* Links inside running text (the agency path, noche 14/10): same ink, underlined so they read as links, not as words */
.lx-plan li a,.lx-sys-ag a,.lx-faq p a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:opacity .2s}
.lx-plan li a:hover,.lx-sys-ag a:hover,.lx-faq p a:hover{opacity:.6}
.lx-sys-ag a{white-space:nowrap}
/* «Gratis» on every example page and in its preview (operator 18/10: «a todas podríamos poner un badge de gratis para reforzar que todo es gratis») */
.lx-gratis{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px 0 4px;border-radius:999px;background:#E3F5EC;color:#0A6B44;font-size:12.5px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;box-shadow:inset 0 0 0 1px rgba(14,159,99,.22);vertical-align:middle}
.lx-gratis svg{flex:none;width:16px;height:16px}.lx-gratis circle{fill:#0E9F63}.lx-gratis path{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lx-tile .lx-gratis{position:absolute;top:10px;left:10px;z-index:3;box-shadow:inset 0 0 0 1px rgba(14,159,99,.22),0 4px 14px rgba(10,30,60,.18)}
.lmp-bar .lx-gratis,.lx-modal .lx-gratis{margin-left:8px}
.lx-sim b{max-width:min(46vw,26ch);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
/* «Lo que pagarías por separado» as a ticket that prints (operator 18/10: «hacela mejor, como un ticket, pero que mantenga
   la esencia; el motion anda mal, aparece de golpe»). The paper is masked: scalloped bottom edge and two notches at the
   perforation (--py, set by landing.js); its shadow is a drop-shadow on the wrapper so it follows the mask */
.lx-receipt.lx-ticket{width:min(440px,100%);padding:0;border-radius:0;background:none;box-shadow:none;filter:drop-shadow(0 26px 34px rgba(10,30,70,.16)) drop-shadow(0 0 1px rgba(22,23,28,.18))}
.lx-ticket .tk-paper{--r:7px;--py:72%;position:relative;background:#fff;color:#16171C;padding:22px 24px 30px;
  -webkit-mask:radial-gradient(circle 12px at 0 var(--py),#0000 97%,#000) 0 0/100% 100% no-repeat,radial-gradient(circle 12px at 100% var(--py),#0000 97%,#000) 0 0/100% 100% no-repeat,radial-gradient(circle var(--r) at 50% 100%,#0000 97%,#000) 0 0/calc(var(--r)*2.4) 100% repeat-x;
  -webkit-mask-composite:source-in,source-in;
  mask:radial-gradient(circle 12px at 0 var(--py),#0000 97%,#000) 0 0/100% 100% no-repeat,radial-gradient(circle 12px at 100% var(--py),#0000 97%,#000) 0 0/100% 100% no-repeat,radial-gradient(circle var(--r) at 50% 100%,#0000 97%,#000) 0 0/calc(var(--r)*2.4) 100% repeat-x;
  mask-composite:intersect}
.lx-ticket .tk-head{display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center}
.lx-ticket .tk-brand{font-size:18px;font-weight:700;letter-spacing:-.02em}
.lx-ticket :is(.tk-meta,.tk-k,.tk-bye),.lx-ticket .r-row.r-sum>span,.lx-ticket .r-tot>span:first-child{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:rgba(22,23,28,.55);font-weight:500}
.lx-ticket .tk-rule,.lx-ticket .tk-perf{display:block;height:1.5px;background:repeating-linear-gradient(90deg,rgba(22,23,28,.3) 0 6px,transparent 6px 10px);transform-origin:0 50%}
.lx-ticket .tk-rule{margin:14px 0 14px}
.lx-ticket .tk-k{margin-bottom:2px}
.lx-ticket .r-row{padding:9px 0}
.lx-ticket .r-row>span{display:flex;flex-direction:column;color:#16171C;font-size:15px;line-height:1.25}
.lx-ticket .r-row>span small{font-family:var(--mono);font-size:11.5px;color:rgba(22,23,28,.48);margin-top:3px;letter-spacing:.01em}
.lx-ticket .r-row b{font-family:var(--mono);font-size:15px;min-width:5ch;text-align:right}
.lx-ticket .r-sum{border-top:1.5px dashed rgba(22,23,28,.18);margin-top:6px;padding-top:13px}
.lx-ticket .r-sum b{position:relative;font-size:18px;color:rgba(22,23,28,.62)}
.lx-ticket .tk-strike{position:absolute;left:-6%;top:50%;width:112%;height:14px;translate:0 -50%;overflow:visible}
.lx-ticket .tk-strike path{fill:none;stroke:#16171C;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:110;stroke-dashoffset:0}
.lx-ticket .tk-perf{margin:18px -24px 0}
.lx-ticket .r-tot{position:relative;border:0;margin:0;padding:20px 0 0;align-items:center}
.lx-ticket .r-big{font-size:44px}
.lx-ticket .tk-stamp{position:absolute;right:2px;top:-20px;padding:7px 13px 6px;border:3px solid #0E9F63;border-radius:10px;box-shadow:inset 0 0 0 1px rgba(14,159,99,.55);color:#0E9F63;font-size:22px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;line-height:1;transform:rotate(-8deg);opacity:.92;background:rgba(255,255,255,.6)}
.lx-ticket .tk-bye{text-align:center;margin-top:16px}
.lx-ticket .r-src{text-align:center;margin-top:16px;padding:0 8px}
body[data-ui="dark"] .lx-receipt.lx-ticket{background:none;box-shadow:none;color:inherit}
body[data-ui="dark"] .lx-ticket .tk-paper{background:#1B1B1F;color:#F5F5F7}
body[data-ui="dark"] .lx-ticket :is(.tk-meta,.tk-k,.tk-bye),body[data-ui="dark"] .lx-ticket .r-sum>span,body[data-ui="dark"] .lx-ticket .r-tot>span:first-child,body[data-ui="dark"] .lx-ticket .r-row>span small{color:rgba(245,245,247,.55)}
body[data-ui="dark"] .lx-ticket .r-row>span{color:#F5F5F7}
body[data-ui="dark"] .lx-ticket .r-sum b{color:rgba(245,245,247,.62)}
body[data-ui="dark"] .lx-ticket .tk-strike path{stroke:#F5F5F7}
body[data-ui="dark"] .lx-ticket :is(.tk-rule,.tk-perf){background:repeating-linear-gradient(90deg,rgba(245,245,247,.3) 0 6px,transparent 6px 10px)}
body[data-ui="dark"] .lx-ticket .tk-stamp{background:rgba(27,27,31,.6)}
@media (max-width:560px){.lx-receipt.lx-ticket{width:min(330px,100%);margin-top:34px}.lx-ticket .tk-paper{padding:18px 18px 28px}.lx-ticket .tk-perf{margin-inline:-18px}.lx-ticket .r-row>span,.lx-ticket .r-row b{font-size:14px}.lx-ticket .r-big{font-size:36px}.lx-ticket .tk-stamp{font-size:18px;top:-16px}.lx-ticket .tk-meta{font-size:10.5px;letter-spacing:.03em}}
/* «Y sabe qué hacer en tu rubro» as a trade sheet (operator 18/10: «la card se ve sosa, como que no está alineada con esas
   pills; buscá una arquitectura mejor»; design report 04 §1, after Square's tool picker): an index on the left with a
   sliding indicator, one card on the right that names the trade and shows a real page of it */
.lx-pb.lx-pb2{display:grid;grid-template-columns:270px minmax(0,1fr);gap:22px;padding:22px}
.lx-pb-idx{position:relative;display:flex;flex-direction:column;gap:2px;align-self:start}
.lx-pb-idx .ind{position:absolute;left:0;right:0;top:0;height:40px;border-radius:14px;background:var(--pill-bg);pointer-events:none}
.lx-pb-idx button{position:relative;z-index:1;display:flex;align-items:center;gap:11px;height:40px;padding:0 14px;border-radius:14px;font-size:15.5px;color:var(--lx-ink2);text-align:left;transition:color .3s}
.lx-pb-idx button:hover{color:var(--ink)}
.lx-pb-idx button.on{color:var(--pill-ink)}
.lx-pb-idx button svg{flex:none;width:18px;height:18px}
.lx-pb-idx .bar{position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;background:currentColor;opacity:.32;transform-origin:0 50%;transform:scaleX(0)}
.lx-pb-idx button.on.run .bar{animation:lxPbBar 4.6s linear forwards}
@keyframes lxPbBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.lx-pb-card2{border-radius:22px;background:var(--lx-surf-2);padding:26px 28px 22px;min-height:100%;display:flex;flex-direction:column}
.lx-pb2 .lx-pb-k{margin:0;font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--lx-ink3);min-height:1.4em}
.lx-pb-t{margin-top:8px;font-size:30px;font-weight:300;letter-spacing:-.03em;line-height:1.1;color:var(--ink)}
.lx-pb-uno{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em}
.lx-pb-uno>span{display:inline-block;font-weight:500}
.lx-pb-body{display:grid;grid-template-columns:minmax(0,1.25fr) 230px;gap:24px;margin-top:22px;flex:1}
.lx-pb-g+.lx-pb-g{margin-top:20px}
.lx-pb-lab{display:block;font-size:13px;font-weight:500;color:var(--lx-ink3);margin-bottom:10px}
.lx-pb2 .lx-pb-mods{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0}
.lx-pb2 .lx-pb-mods li{min-height:52px;padding:8px 10px;border-radius:14px;background:var(--lx-surf);font-size:14.5px;line-height:1.25}
.lx-pb2 .lx-pb-auto{list-style:none;display:grid;gap:9px;margin:0;font-size:15px}
.lx-pb-page{margin:0;display:flex;flex-direction:column;gap:10px}
.lx-pb-shot{--h:330px;display:block;height:var(--h);border-radius:16px;overflow:hidden;background:var(--lx-surf);box-shadow:var(--lx-shadow),0 0 0 1px var(--lx-line);cursor:pointer;padding:0}
.lx-pb-shot img{display:block;width:100%;height:auto;animation:lxPbScroll 16s linear infinite alternate}
@keyframes lxPbScroll{from{transform:translateY(0)}to{transform:translateY(calc(-100% + var(--h)))}}
/* the phone capture (landing-shots.mjs --phones): it rests at the top, scrolls down slowly and rests again; until it arrives
   the frame shows a soft sweep, never a half-drawn page */
.lx-pb-shot.phone img{opacity:0;transition:opacity .35s ease;animation:lxPbPhone 18s ease-in-out infinite alternate}
.lx-pb-shot.phone.ok img{opacity:1}
@keyframes lxPbPhone{0%,14%{transform:translateY(0)}86%,100%{transform:translateY(calc(-100% + var(--h)))}}
.lx-pb-shot.phone:not(.ok){background:linear-gradient(100deg,var(--lx-surf) 35%,var(--lx-surf-2) 50%,var(--lx-surf) 65%) 0 0/250% 100%;animation:lxPbSweep 1.3s linear infinite}
@keyframes lxPbSweep{to{background-position:-250% 0}}
.lx-pb-page figcaption{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px;color:var(--lx-ink3)}
.lx-pb-page figcaption .n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lx-pb-open{flex:none;height:32px;padding:0 12px;border-radius:999px;font-size:13px;font-weight:500;background:var(--pill-bg);color:var(--pill-ink)}
.lx-pb-foot{display:flex;gap:12px;align-items:flex-start;margin-top:22px;padding-top:18px;border-top:1px solid var(--lx-line)}
.lx-pb-foot .lx-orb{margin-top:3px;flex:none}
.lx-pb-msg{flex:1;min-width:0;border-radius:4px 16px 16px 16px;background:var(--lx-surf);padding:11px 14px}
.lx-pb-msg small{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--lx-ink3)}
.lx-pb2 .lx-pb-sum{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;margin:8px 0 0;font-size:14.5px;line-height:1.35}
@media (prefers-reduced-motion:reduce){.lx-pb-shot img,.lx-pb-shot.phone img,.lx-pb-shot.phone:not(.ok){animation:none}}
@media (max-width:900px){
  .lx-pb.lx-pb2{grid-template-columns:minmax(0,1fr);gap:14px;padding:16px}
  .lx-pb-idx{flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;gap:6px;margin:0 -16px;padding:0 16px 2px;scrollbar-width:none;-webkit-mask:linear-gradient(90deg,#000 calc(100% - 32px),transparent)}
  .lx-pb-idx::-webkit-scrollbar{display:none}
  .lx-pb-idx .ind{display:none}
  .lx-pb-idx button{flex:none;height:34px;padding:0 12px;border-radius:999px;font-size:13.5px;background:var(--lx-surf-2);scroll-snap-align:center}
  .lx-pb-idx button.on{background:var(--pill-bg)}
  .lx-pb-idx button svg{width:16px;height:16px}
  .lx-pb-idx .bar{display:none}
  .lx-pb-card2{padding:18px 16px 16px}
  .lx-pb-t{font-size:24px}
  .lx-pb-body{grid-template-columns:minmax(0,1fr);gap:18px}
  .lx-pb-page{order:-1}.lx-pb-shot{--h:200px}
  .lx-pb-shot.phone{--h:300px;width:min(100%,220px);margin-inline:auto}
  .lx-pb2 .lx-pb-sum{grid-template-columns:1fr}
}
.lx-pb2 .lx-pb-mods .i{background:var(--lx-surf-2)}
.lx-pb-page[hidden]{display:none}.lx-pb-body:has(.lx-pb-page[hidden]){grid-template-columns:minmax(0,1fr)}
/* what exists today, next to what is coming (operator 18/10: «revisá todo eso que pusimos próximamente: ¿realmente están pending?») */
.lx-hoy{font-style:normal;font-size:11px;font-weight:600;letter-spacing:.01em;padding:3px 8px;border-radius:999px;background:#E3F5EC;color:#0A6B44}
.lx-tm-b li :is(.lx-hoy,.lx-soon){margin-left:8px;vertical-align:1px;white-space:nowrap}
body[data-ui="dark"] .lx-hoy{background:rgba(14,159,99,.2);color:#7FE0B0}
/* «Por qué es gratis»: the AI made it cheap (operator 18/10: «alguna parte de mención a la IA y los avances tecnológicos, de por qué») */
.lx-why .lx-h2{max-width:21ch}
.lx-why-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:40px}
.lx-why-c{border-radius:24px;padding:26px 24px 24px;display:flex;flex-direction:column;gap:10px}
.lx-why-c b{font-size:clamp(44px,5vw,64px);font-weight:300;letter-spacing:-.04em;line-height:1;color:var(--ink)}
.lx-why-c span{font-size:15px;line-height:1.4;color:var(--lx-ink2)}
.lx-why-c sup{font-size:.7em;color:var(--lx-ink3)}
.lx-why-end{margin-top:26px;font-size:19px;font-weight:500;color:var(--ink)}
.lx-why-src{margin-top:14px;max-width:760px;font-size:12px;line-height:1.5;color:var(--lx-ink3)}
.lx-yes-sub{max-width:560px;margin:8px auto 0;font-size:17px;line-height:1.5;color:var(--lx-ink2);text-align:center}
@media (max-width:760px){.lx-why-grid{grid-template-columns:minmax(0,1fr)}.lx-why-c{padding:20px}.lx-yes-sub{font-size:15.5px;padding:0 6px}}
.lx-why .lx-lead{margin-top:22px}
/* the paragraph under «US$0» a little lower, so it never meets the words under the number */
.lx-wall-head{margin-top:-36vh}
/* the trade index without the loading bar (operator 19/10: «eso que va cargando no se ve bien») */
.lx-pb-idx .bar{display:none}
/* «Pegá tu web»: the old web (a grey sketch) swept into the new page */
.lx-mold{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;gap:7px;padding:12px 14px;background:#ECECEC;font-family:"Times New Roman",Times,serif;clip-path:inset(100% 0 0 0)}
.lx-mold .h{height:14px;border-radius:2px;background:#C7C7C7}
.lx-mold b{font-size:19px;font-weight:400;color:#1A0DAB;text-decoration:underline}
.lx-mold .l{height:7px;width:88%;border-radius:2px;background:#D2D2D2}.lx-mold .l.s{width:56%}
.lx-mold .box{height:54px;border:1px solid #C2C2C2;background:#DADADA}
.lx-mscan{position:absolute;left:0;right:0;top:0;z-index:2;height:2px;opacity:0;background:linear-gradient(90deg,transparent,#5B8CFF 30%,#4FD1C5 70%,transparent);box-shadow:0 0 14px 3px rgba(91,140,255,.55)}
/* the ticket printed with transforms only (operator 19/10: «se ve trancada»): no filter on the wrapper, a still frame and a
   moving window, the shadow as its own element that grows with the paper, the stamp as its own layer */
.lx-receipt.lx-ticket{filter:none}
.lx-ticket .tk-wrap{position:relative}
/* the shadow follows the paper's own shape (its notches and its scalloped edge), drawn once the ticket is out: a rectangle
   behind it showed through the notches as grey bumps (operator 20/10: «se ve feo, desalineado») */
.lx-ticket .tk-shadow{display:none}
.lx-ticket .tk-s{transition:filter .6s ease}
.lx-ticket.done .tk-s{filter:drop-shadow(0 10px 14px rgba(10,30,70,.11)) drop-shadow(0 1px 1px rgba(22,23,28,.1))}
/* the stamp on its own line, centered under the total: it no longer sits on the perforation and the struck price */
.lx-ticket .tk-stampbox{display:flex;justify-content:center;margin-top:18px}
.lx-ticket .tk-stampbox .tk-stamp{position:relative;right:auto;top:auto}
.lx-ticket .tk-s,.lx-ticket .tk-o{position:relative;overflow:hidden}
.lx-ticket .tk-o,.lx-ticket .tk-i{will-change:transform}
.lx-ticket .tk-stamp{will-change:transform,opacity}
.lx-ticket .tk-ring{position:absolute;inset:-5px;border-radius:13px;border:2px solid #0E9F63;opacity:0;pointer-events:none;will-change:transform,opacity}
body[data-ui="dark"] .lx-ticket.done .tk-s{filter:drop-shadow(0 10px 14px rgba(0,0,0,.45)) drop-shadow(0 0 1px rgba(255,255,255,.12))}
/* the plans, AAA (operator 19/10: «las 3 cards deberían tener más estilo, alineadas, más moderno; si no ni se notan los
   precios»; after Homerun, Chronicle and IFTTT on Mobbin): name and who it is for, a big price, the button, then what it
   includes with checks; Pro dark and raised; every card the same height and the same rows */
.lx-plans.lx-tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch;max-width:1080px;margin:44px auto 0;text-align:left}
.lx-tier{position:relative;display:flex;flex-direction:column;padding:28px 26px 28px;border-radius:28px;background:rgba(255,255,255,.86);color:#16171C;box-shadow:0 30px 60px -28px rgba(10,30,70,.35),0 0 0 1px rgba(22,23,28,.06);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.lx-tier.hl{background:#16171C;color:#F5F5F7;box-shadow:0 40px 80px -30px rgba(10,20,50,.6),0 0 0 1px rgba(255,255,255,.06);transform:translateY(-10px)}
.lx-tier-tag{align-self:flex-start;height:26px;display:inline-flex;align-items:center;padding:0 11px;border-radius:999px;font-size:12.5px;font-weight:600;background:rgba(22,23,28,.06);color:rgba(22,23,28,.7)}
.lx-tier.hl .lx-tier-tag{background:#3DDC97;color:#0B2A1C}
.lx-tier h3{margin:18px 0 0;font-size:24px;font-weight:600;letter-spacing:-.03em}
.lx-tier-d{margin:6px 0 0;font-size:15px;line-height:1.4;color:rgba(22,23,28,.62);min-height:2.8em}
.lx-tier.hl .lx-tier-d{color:rgba(245,245,247,.66)}
.lx-tier-p{display:flex;align-items:baseline;gap:8px;margin-top:22px;font-variant-numeric:tabular-nums}
.lx-tier-p [data-pv]{font-size:58px;font-weight:300;letter-spacing:-.05em;line-height:1}
.lx-tier-p small{font-size:14px;font-weight:500;color:rgba(22,23,28,.55)}
.lx-tier.hl .lx-tier-p small{color:rgba(245,245,247,.6)}
.lx-tier-go{display:flex;align-items:center;justify-content:center;height:48px;margin-top:24px;border-radius:999px;font-size:15px;font-weight:600;text-decoration:none;background:#16171C;color:#fff;transition:transform .2s,background .2s}
.lx-tier-go:hover{transform:translateY(-1px);background:#2a2b33}
.lx-tier.hl .lx-tier-go{background:#fff;color:#16171C}
.lx-tier.hl .lx-tier-go:hover{background:#ECECEF}
.lx-tier[data-pp="agencia"] .lx-tier-go{background:transparent;color:#16171C;box-shadow:inset 0 0 0 1.5px rgba(22,23,28,.22)}
.lx-tier[data-pp="agencia"] .lx-tier-go:hover{background:rgba(22,23,28,.05)}
.lx-tier-k{margin:26px 0 0;padding-top:20px;border-top:1px solid rgba(22,23,28,.1);font-size:13px;font-weight:600;color:rgba(22,23,28,.55)}
.lx-tier.hl .lx-tier-k{border-color:rgba(255,255,255,.12);color:rgba(245,245,247,.55)}
.lx-tier ul{list-style:none;display:grid;gap:12px;margin:14px 0 0;padding:0;font-size:15px;line-height:1.35}
.lx-tier li{display:flex;gap:10px;align-items:flex-start}
.lx-tier li svg{flex:none;width:18px;height:18px;margin-top:1px}
.lx-tier li circle{fill:rgba(14,159,99,.14)}.lx-tier li path{fill:none;stroke:#0E9F63;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lx-tier.hl li circle{fill:rgba(61,220,151,.18)}.lx-tier.hl li path{stroke:#3DDC97}
body[data-ui="dark"] .lx-tier:not(.hl){background:rgba(28,28,32,.86);color:#F5F5F7}
body[data-ui="dark"] .lx-tier:not(.hl) :is(.lx-tier-d,.lx-tier-p small,.lx-tier-k){color:rgba(245,245,247,.6)}
@media (max-width:900px){.lx-plans.lx-tiers{grid-template-columns:minmax(0,1fr);max-width:480px;gap:16px}.lx-tier.hl{transform:none}.lx-tier{padding:24px 22px}.lx-tier-p [data-pv]{font-size:50px}.lx-tier-d{min-height:0}}