/* TEW · Demos animadas de servicios — modo oscuro de la marca, vidrio y profundidad.
   Medidas en cqw: dentro del dispositivo, relativas a su ancho; fuera (tarjetas flotantes), al ancho del escenario. */
body.tew-page .dm{--tx:#f4f0fa;--mut:#9e95b0;--line:rgba(255,255,255,.09);--sk:rgba(255,255,255,.07);--s1:#120d1f;--s2:#1a1429;--s3:#231b36;
  --g:linear-gradient(135deg,#d14ee2,#7c2dc6);--glow:rgba(160,64,220,.55);
  display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,88px);align-items:center}
body.tew-page .dm.is-compact{display:block;width:100%;height:100%;padding:7%}

/* ---------- Pasos ---------- */
body.tew-page .dm-steps{list-style:none;margin:0;padding:0;display:grid;gap:4px}
body.tew-page .dm-steps li{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);gap:2px 18px;padding:18px 18px 20px;border-radius:20px;cursor:pointer;transition:background-color .5s}
body.tew-page .dm-steps li.is-on{background:linear-gradient(90deg,rgba(209,78,226,.09),rgba(124,45,198,.02) 70%)}
body.tew-page .dm-steps .n{grid-row:span 2;align-self:start;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.14);font:600 .8rem/1 var(--f-display);color:var(--mut);transition:all .5s}
body.tew-page .dm-steps li.is-on .n{border-color:transparent;background:var(--g);color:#fff;box-shadow:0 0 0 6px rgba(209,78,226,.12),0 10px 30px -8px var(--glow)}
body.tew-page .dm-steps b{font:600 1.14rem/1.25 var(--f-display);letter-spacing:-.01em;color:#fff;opacity:.45;transition:opacity .5s}
body.tew-page .dm-steps .t{font-size:.93rem;line-height:1.5;color:var(--on-ink-muted);opacity:.45;transition:opacity .5s}
body.tew-page .dm-steps li.is-on b,body.tew-page .dm-steps li.is-on .t{opacity:1}
body.tew-page .dm-steps .bar{position:absolute;left:80px;right:18px;bottom:8px;height:2px;border-radius:2px;background:var(--g);transform-origin:left;transform:scaleX(var(--p,0));opacity:0}
body.tew-page .dm-steps li.is-on .bar{opacity:1}

/* ---------- Escenario ---------- */
body.tew-page .dm-stage{position:relative;width:100%;container-type:inline-size;perspective:1600px;isolation:isolate}
body.tew-page .dm.is-compact .dm-stage{height:100%;display:flex;align-items:center;justify-content:center}
body.tew-page .dm-glow{position:absolute;inset:4% 8%;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(160,64,220,.55),rgba(124,45,198,.18) 55%,transparent);filter:blur(30px);pointer-events:none}
body.tew-page .dm-stage::after{content:"";position:absolute;inset:-6% -4%;z-index:-2;background:radial-gradient(circle,rgba(255,255,255,.06) 1px,transparent 1.3px) 0 0/22px 22px;-webkit-mask:radial-gradient(closest-side,#000,transparent);mask:radial-gradient(closest-side,#000,transparent);pointer-events:none}
body.tew-page .dm.is-compact .dm-stage::after{display:none}

/* ---------- Dispositivos (vidrio oscuro) ---------- */
body.tew-page .dv{position:relative;container-type:inline-size;color:var(--tx);font-family:var(--f-body);animation:dmFloat 7s ease-in-out infinite}
@keyframes dmFloat{50%{translate:0 -10px}}
body.tew-page .dm:not(.is-compact) .dv{transform:rotateY(-9deg) rotateX(4deg);transition:transform 1s var(--ease)}
body.tew-page .dm:not(.is-compact) .dm-stage:hover .dv{transform:rotateY(-3deg) rotateX(1deg)}
body.tew-page .dv-browser,body.tew-page .dv-canvas{width:100%;aspect-ratio:16/10.6;border-radius:2.2cqw;overflow:hidden;background:linear-gradient(180deg,#181126,#0e0a17);box-shadow:0 0 0 1px rgba(255,255,255,.1),inset 0 1px 0 rgba(255,255,255,.08),0 5cqw 10cqw -4cqw rgba(0,0,0,.85),0 0 14cqw -4cqw var(--glow)}
body.tew-page .dm.is-compact .dv-browser,body.tew-page .dm.is-compact .dv-canvas{width:100%;max-height:100%}
body.tew-page .dv-bar{display:flex;align-items:center;gap:1cqw;height:5.2cqw;padding:0 2.4cqw;background:rgba(255,255,255,.025);border-bottom:1px solid var(--line)}
body.tew-page .dv-bar i{width:1.2cqw;height:1.2cqw;border-radius:50%;background:rgba(255,255,255,.16)}
body.tew-page .dv-url{margin:0 auto;padding:.7cqw 3cqw;border-radius:99px;background:rgba(255,255,255,.05);font:500 1.4cqw/1 var(--f-body);color:var(--mut)}
body.tew-page .dv-body{position:absolute;left:0;right:0;top:5.2cqw;bottom:0;padding:3.2cqw 4cqw;overflow:hidden}
body.tew-page .dv-phone{width:min(100%,290px);aspect-ratio:9/18.8;margin:0 auto;padding:1.4%;border-radius:14%/6.6%;background:linear-gradient(160deg,#2a2139,#07050c 40%);box-shadow:0 0 0 1px rgba(255,255,255,.12),0 5cqw 10cqw -4cqw rgba(0,0,0,.85),0 0 14cqw -4cqw var(--glow)}
body.tew-page .dm:not(.is-compact) .dv-phone{transform:rotateY(10deg) rotateX(4deg)}
body.tew-page .dm:not(.is-compact) .dm-stage:hover .dv-phone{transform:rotateY(3deg) rotateX(1deg)}
body.tew-page .dm.is-compact .dv-phone{width:auto;height:100%;max-width:100%}
body.tew-page .dv-screen{position:relative;height:100%;border-radius:12.4%/5.8%;background:#0e0a17;overflow:hidden;container-type:inline-size}
body.tew-page .dv-screen::before{content:"";position:absolute;left:50%;top:2.2%;z-index:9;width:30%;height:3.6%;border-radius:99px;background:#000;transform:translateX(-50%)}

/* ---------- Cursor y tarjetas flotantes ---------- */
body.tew-page .dv-cur{position:absolute;left:0;top:0;z-index:30;width:24px;height:24px;pointer-events:none;opacity:0;filter:drop-shadow(0 4px 8px rgba(0,0,0,.55))}
body.tew-page .dv-cur svg{display:block;width:100%;height:100%}
body.tew-page .dv-cur path{fill:#fff;stroke:#1a1429;stroke-width:1.2;stroke-linejoin:round}
body.tew-page .dm.is-compact .dv-cur{width:16px;height:16px}
body.tew-page .dv-toast{position:absolute;z-index:25;right:-3%;top:6%;display:flex;align-items:center;gap:1.8cqw;min-width:34%;padding:1.6cqw 2.6cqw 1.6cqw 1.6cqw;border-radius:2.2cqw;color:#fff;
  background:rgba(26,20,41,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px rgba(255,255,255,.12),0 3cqw 6cqw -1cqw rgba(0,0,0,.7);opacity:0}
body.tew-page .dv-toast .ti{flex:none;display:grid;place-items:center;width:5.2cqw;height:5.2cqw;border-radius:1.6cqw;background:var(--g);box-shadow:0 1cqw 3cqw -1cqw var(--glow)}
body.tew-page .dv-toast .ti .i{width:2.6cqw;height:2.6cqw;color:#fff}
body.tew-page .dv-toast b{display:block;font:600 1.8cqw/1.25 var(--f-display)}
body.tew-page .dv-toast small{display:block;font-size:1.4cqw;color:var(--mut)}
body.tew-page .dm-meta .dv-toast,body.tew-page .dm-shop .dv-toast{right:2%;top:14%}
body.tew-page .dm.is-compact .dv-toast{right:2%;top:4%;min-width:48%;padding:2cqw 3cqw 2cqw 2cqw;gap:2.4cqw;border-radius:3cqw}
body.tew-page .dm.is-compact .dv-toast .ti{width:7cqw;height:7cqw;border-radius:2cqw}
body.tew-page .dm.is-compact .dv-toast .ti .i{width:3.6cqw;height:3.6cqw}
body.tew-page .dm.is-compact .dv-toast b{font-size:2.8cqw}
body.tew-page .dm.is-compact .dv-toast small{font-size:2.1cqw}

/* Posición del aviso según la demo, para no tapar métricas ni columnas */
body.tew-page .dm-seo .dv-toast,body.tew-page .dm-gads .dv-toast{right:auto;left:-3%;top:auto;bottom:6%}
body.tew-page .dm-b2b .dv-toast{right:auto;left:-3%;top:auto;bottom:-4%}
body.tew-page .dm.is-compact .dm-seo .dv-toast,body.tew-page .dm.is-compact .dm-gads .dv-toast,body.tew-page .dm.is-compact .dm-b2b .dv-toast{left:3%;bottom:5%;top:auto;right:auto}

/* ---------- Buscador (Google en modo oscuro) ---------- */
body.tew-page .g-search{display:flex;align-items:center;gap:1.4cqw;width:64%;height:5.4cqw;padding:0 2.2cqw;border-radius:99px;background:var(--s3);box-shadow:0 0 0 1px var(--line);font:500 1.8cqw/1 var(--f-body);color:var(--tx)}
body.tew-page .g-search .i{width:2.1cqw;height:2.1cqw;color:var(--mut)}
body.tew-page .g-search .caret{width:.22cqw;height:2.4cqw;background:#d14ee2;animation:dmCaret 1s steps(1) infinite}
@keyframes dmCaret{50%{opacity:0}}
body.tew-page .g-list{position:relative;width:64%;height:44cqw;margin-top:2.6cqw}
body.tew-page .g-row{position:absolute;left:0;right:0;top:calc(var(--p) * 9cqw);display:flex;align-items:flex-start;gap:1.6cqw;height:8.2cqw;padding:1.3cqw 1.6cqw;border-radius:1.8cqw;border:1px solid transparent}
body.tew-page .g-fav{flex:none;width:2.6cqw;height:2.6cqw;margin-top:.3cqw;border-radius:50%;background:rgba(255,255,255,.12)}
body.tew-page .g-row>div{min-width:0;flex:1}
body.tew-page .g-u{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:500 1.35cqw/1.3 var(--f-body);color:var(--mut)}
body.tew-page .g-u em{font-style:normal;font-weight:700;color:var(--tx);margin-right:.8cqw}
body.tew-page .g-row b{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:600 1.85cqw/1.35 var(--f-body);color:#c3a8ff}
body.tew-page .g-row .dm-sk{display:block;width:72%;height:.9cqw;margin-top:1cqw;border-radius:99px;background:var(--sk)}
body.tew-page .g-row.you,body.tew-page .g-row.pat{background:linear-gradient(90deg,rgba(209,78,226,.2),rgba(124,45,198,.08));border-color:rgba(209,78,226,.5);box-shadow:0 1.4cqw 4cqw -1cqw rgba(209,78,226,.45)}
body.tew-page .g-row.you b,body.tew-page .g-row.pat b{color:#fff}
body.tew-page .g-row.you .g-fav,body.tew-page .g-row.pat .g-fav{background:var(--g)}
body.tew-page .pat-links{display:flex;gap:1cqw;margin-top:.8cqw}
body.tew-page .pat-links i{font:600 1.25cqw/1 var(--f-body);font-style:normal;color:#e6d6ff;padding:.6cqw 1.2cqw;border-radius:99px;background:rgba(255,255,255,.08)}

/* Métricas flotantes (fuera del navegador) */
body.tew-page .g-kpi{position:absolute;z-index:22;right:-4%;top:16%;width:27%;padding:2.2cqw;border-radius:2.4cqw;color:#fff;background:rgba(26,20,41,.8);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 0 0 1px rgba(255,255,255,.12),0 4cqw 8cqw -2cqw rgba(0,0,0,.75),0 0 10cqw -3cqw var(--glow)}
body.tew-page .g-kpi span,body.tew-page .g-kpi small{display:block;font:500 1.25cqw/1.3 var(--f-body);color:var(--mut)}
body.tew-page .g-kpi small{margin-top:1.8cqw}
body.tew-page .g-kpi b{display:block;font:800 5.2cqw/1.05 var(--f-display);letter-spacing:-.03em;background:var(--g);-webkit-background-clip:text;background-clip:text;color:transparent}
body.tew-page .g-kpi small+b{font-size:3.2cqw}
body.tew-page .g-chart{display:block;width:100%;height:5.6cqw;margin-top:1cqw;overflow:visible}
body.tew-page .g-chart path{fill:none;stroke:#d14ee2;stroke-width:2.6;stroke-linecap:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 4px rgba(209,78,226,.8))}
body.tew-page .bud{display:block;height:1.1cqw;margin:1.2cqw 0 .4cqw;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}
body.tew-page .bud i{display:block;height:100%;width:100%;border-radius:inherit;background:var(--g);transform-origin:left}
body.tew-page .dm.is-compact .g-kpi{right:3%;top:22%;width:30%;padding:2.6cqw}
body.tew-page .dm.is-compact .g-kpi span,body.tew-page .dm.is-compact .g-kpi small{font-size:1.9cqw}
body.tew-page .dm.is-compact .g-kpi b{font-size:6.4cqw}
body.tew-page .dm.is-compact .g-kpi small+b{font-size:4.2cqw}

/* Página de destino */
body.tew-page .dv-page{position:absolute;inset:0;z-index:5;padding:2.4cqw 4cqw;background:#100b1a}
body.tew-page .pg-nav{display:flex;align-items:center;gap:2cqw;padding-bottom:2cqw;border-bottom:1px solid var(--line)}
body.tew-page .pg-logo{margin-right:auto;font:800 2.2cqw/1 var(--f-display);background:var(--g);-webkit-background-clip:text;background-clip:text;color:transparent}
body.tew-page .pg-nav i{width:7cqw;height:1cqw;border-radius:99px;background:var(--sk)}
body.tew-page .pg-hero{display:grid;gap:1.4cqw;margin-top:3cqw;padding:4.4cqw;border-radius:2.4cqw;background:radial-gradient(90% 140% at 100% 0%,rgba(209,78,226,.4),transparent 60%),var(--s2);box-shadow:inset 0 0 0 1px var(--line);color:#fff}
body.tew-page .pg-hero b{font:800 4.2cqw/1.05 var(--f-display);letter-spacing:-.03em}
body.tew-page .pg-hero>i{display:block;width:60%;height:1cqw;border-radius:99px;background:rgba(255,255,255,.16)}
body.tew-page .pg-hero>i.s{width:42%}
body.tew-page .pg-btn{justify-self:start;padding:1.4cqw 3cqw;border-radius:99px;background:var(--g);color:#fff;font:600 1.6cqw/1 var(--f-body);box-shadow:0 1cqw 3cqw -1cqw var(--glow)}
body.tew-page .pg-form{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:1.2cqw;margin-top:1cqw}
body.tew-page .pg-form .f{display:flex;align-items:center;height:4.6cqw;padding:0 1.4cqw;border-radius:1.2cqw;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px var(--line)}
body.tew-page .pg-form .f em{display:block;height:1cqw;width:100%;border-radius:99px;background:rgba(255,255,255,.35);transform-origin:left}

/* ---------- Google Maps ---------- */
body.tew-page .mp{position:absolute;inset:0;background:radial-gradient(circle,rgba(255,255,255,.07) 1px,transparent 1.2px) 0 0/3cqw 3cqw,radial-gradient(60% 70% at 55% 45%,rgba(124,45,198,.3),transparent 70%),#130d20}
body.tew-page .mp-roads{position:absolute;inset:0;width:100%;height:100%}
body.tew-page .mp-roads path{fill:none;stroke:rgba(255,255,255,.1);stroke-width:7;stroke-linecap:round}
body.tew-page .mp-roads path.thin{stroke-width:3}
body.tew-page .pin{position:absolute;left:var(--x);top:var(--y);width:3cqw;height:3cqw;margin:-3cqw 0 0 -1.5cqw;border-radius:50% 50% 50% 0;background:#4b3f60;transform:rotate(-45deg)}
body.tew-page .pin.you{z-index:3;width:7cqw;height:7cqw;margin:-7cqw 0 0 -3.5cqw;background:var(--g);box-shadow:0 0 0 1.8cqw rgba(209,78,226,.16),0 0 0 4cqw rgba(209,78,226,.06),0 1cqw 4cqw var(--glow)}
body.tew-page .pin.you i{display:grid;place-items:center;width:100%;height:100%;transform:rotate(45deg);font:800 2.4cqw/1 var(--f-display);font-style:normal;color:#fff}
body.tew-page .mp-card{position:absolute;left:6%;right:6%;bottom:6%;z-index:4;display:grid;grid-template-columns:auto 1fr;gap:1cqw 2cqw;align-items:center;padding:2.4cqw;border-radius:2.6cqw;color:#fff;background:rgba(26,20,41,.85);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px rgba(255,255,255,.12),0 3cqw 7cqw -2cqw rgba(0,0,0,.8)}
body.tew-page .mp-card .te{display:grid;place-items:center;width:7cqw;height:7cqw;border-radius:2cqw;background:var(--g);font:800 2.6cqw/1 var(--f-display);font-style:normal;color:#fff}
body.tew-page .mp-card>span>b{display:block;font:700 2.5cqw/1.2 var(--f-display)}
body.tew-page .dm-stars{position:relative;display:inline-block;font-style:normal;font-size:2.1cqw;color:rgba(255,255,255,.18);letter-spacing:.2cqw}
body.tew-page .dm-stars .fill{position:absolute;left:0;top:0;overflow:hidden;white-space:nowrap;font-style:normal;color:#ffc24b;width:var(--s,0%)}
body.tew-page .mp-card small{display:block;font-size:1.6cqw;color:#5ee08e}
body.tew-page .mp-card small b{color:#fff}
body.tew-page .mp-acts{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr 1fr;gap:1.2cqw;margin-top:1cqw}
body.tew-page .mp-acts i{display:grid;place-items:center;height:4.4cqw;border-radius:99px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px var(--line);font:600 1.5cqw/1 var(--f-body);font-style:normal;color:var(--tx)}
body.tew-page .mp-acts i.wa{box-shadow:none;background:var(--g);color:#fff}

/* ---------- Instagram (modo oscuro) ---------- */
body.tew-page .ig-top{position:absolute;left:0;right:0;top:0;z-index:3;display:flex;justify-content:space-between;align-items:center;height:18cqw;padding:8cqw 5cqw 0;background:#0e0a17;border-bottom:1px solid var(--line)}
body.tew-page .ig-top b{font:700 6cqw/1 var(--f-display);letter-spacing:-.03em;color:#fff}
body.tew-page .ig-top .i{width:5.4cqw;height:5.4cqw;margin-left:3cqw;color:#fff}
body.tew-page .ig-feed{position:absolute;left:0;right:0;top:18cqw;background:#0e0a17}
body.tew-page .ig-post{padding-bottom:4cqw}
body.tew-page .ig-h{display:flex;align-items:center;gap:3cqw;padding:3cqw 4cqw}
body.tew-page .ig-h>i{display:block;width:9cqw;height:9cqw;border-radius:50%;background:var(--sk)}
body.tew-page .ig-h>i.te,body.tew-page .ch-h .te{display:grid;place-items:center;background:var(--g);font:800 3.4cqw/1 var(--f-display);font-style:normal;color:#fff;box-shadow:0 0 0 .6cqw #0e0a17,0 0 0 1.1cqw #d14ee2}
body.tew-page .ig-h>span{display:block;height:2.2cqw;width:36%;border-radius:99px;background:var(--sk)}
body.tew-page .ig-post.pat .ig-h>span{height:auto;width:auto;background:none}
body.tew-page .ig-h b{display:block;font:700 3.6cqw/1.2 var(--f-display);color:#fff}
body.tew-page .ig-h small{display:block;font-size:3cqw;color:var(--mut)}
body.tew-page .ig-img{position:relative;aspect-ratio:1;background:var(--s2);overflow:hidden}
body.tew-page .ig-img img{width:100%;height:100%;object-fit:cover}
body.tew-page .heart{position:absolute;left:50%;top:50%;font-size:26cqw;line-height:1;color:#fff;text-shadow:0 2cqw 6cqw rgba(0,0,0,.5);transform:translate(-50%,-50%) scale(0);opacity:0}
body.tew-page .ig-cta{display:flex;justify-content:space-between;align-items:center;margin:0 0 2cqw;padding:3.4cqw 4cqw;background:var(--g);color:#fff;font:600 3.6cqw/1 var(--f-body)}
body.tew-page .ig-cta .i{width:4cqw;height:4cqw}
body.tew-page .ig-likes{padding:0 4cqw;font-size:3.4cqw;color:var(--tx)}
body.tew-page .ig-chat{position:absolute;inset:0;z-index:4;background:radial-gradient(80% 50% at 50% 0%,rgba(124,45,198,.25),transparent 70%),#0e0a17}
body.tew-page .ch-h{display:flex;align-items:center;gap:3cqw;height:24cqw;padding:10cqw 4cqw 0;border-bottom:1px solid var(--line)}
body.tew-page .ch-h>.i{width:5cqw;height:5cqw;transform:rotate(180deg);color:#fff}
body.tew-page .ch-h .te{width:9cqw;height:9cqw;border-radius:50%}
body.tew-page .ch-h b{font:700 4cqw/1 var(--f-display);color:#fff}
body.tew-page .ch-body{display:grid;gap:3cqw;padding:6cqw 4cqw}
body.tew-page .dm-bub{max-width:78%;padding:3cqw 4cqw;border-radius:4.4cqw;font-size:3.7cqw;line-height:1.35;color:var(--tx);background:var(--s3)}
body.tew-page .dm-bub.me{justify-self:end;background:var(--g);color:#fff;border-bottom-right-radius:1.2cqw;box-shadow:0 2cqw 5cqw -2cqw var(--glow)}
body.tew-page .dm-bub.them{border-bottom-left-radius:1.2cqw}
body.tew-page .ch-body .dm-typing{justify-self:start;display:flex;gap:1.4cqw;padding:3.4cqw 4cqw;border-radius:4cqw;background:var(--s3)}
body.tew-page .ch-body .dm-typing i{width:1.8cqw;height:1.8cqw;border-radius:50%;background:var(--mut);animation:dmDot 1s infinite}
body.tew-page .ch-body .dm-typing i:nth-child(2){animation-delay:.15s}
body.tew-page .ch-body .dm-typing i:nth-child(3){animation-delay:.3s}
@keyframes dmDot{50%{transform:translateY(-1cqw);opacity:.5}}

/* ---------- Diseño web ---------- */
body.tew-page .web .wf{position:absolute;inset:3cqw 4cqw;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:3.6cqw 4.6cqw 3cqw 4.6cqw minmax(0,1fr) 11cqw;gap:1.8cqw 2.4cqw}
body.tew-page .wf>span{display:block;border-radius:1.2cqw;background:rgba(255,255,255,.035);border:1px dashed rgba(209,78,226,.4);transform-origin:left}
body.tew-page .wf-nav{grid-column:1/-1;grid-row:1}
body.tew-page .wf-t1{grid-column:1/3;grid-row:2}
body.tew-page .wf-t2{grid-column:1/3;grid-row:3;width:70%}
body.tew-page .wf-btn{grid-column:1/2;grid-row:4;width:60%;background:rgba(209,78,226,.2)!important}
body.tew-page .wf-img{grid-column:3;grid-row:2/6}
body.tew-page .wf-c{grid-row:6}
body.tew-page .web-real{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0}
body.tew-page .web-phone{position:absolute;z-index:22;right:-3%;bottom:-6%;width:21%;aspect-ratio:9/18.8;padding:.5cqw;border-radius:2.8cqw;background:linear-gradient(160deg,#2a2139,#07050c 40%);box-shadow:0 0 0 1px rgba(255,255,255,.14),0 4cqw 8cqw -2cqw rgba(0,0,0,.8)}
body.tew-page .web-phone img{width:100%;height:100%;object-fit:cover;object-position:50% 0;border-radius:2.3cqw}
body.tew-page .web-score{position:absolute;z-index:22;left:-3%;bottom:8%;display:grid;grid-template-columns:auto auto;align-items:center;gap:0 1.6cqw;padding:1.8cqw 2.6cqw 1.8cqw 1.8cqw;border-radius:2.4cqw;color:#fff;background:rgba(26,20,41,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 0 0 1px rgba(255,255,255,.12),0 3cqw 7cqw -2cqw rgba(0,0,0,.8)}
body.tew-page .web-score svg{grid-row:span 2;width:7.4cqw;height:7.4cqw;transform:rotate(-90deg)}
body.tew-page .web-score circle{fill:none;stroke-width:4}
body.tew-page .web-score .bg{stroke:rgba(255,255,255,.1)}
body.tew-page .web-score .fg{stroke:#4ee38f;stroke-linecap:round;stroke-dasharray:100.5;stroke-dashoffset:100.5;filter:drop-shadow(0 0 3px rgba(78,227,143,.8))}
body.tew-page .web-score b{font:800 3.6cqw/1 var(--f-display);color:#4ee38f}
body.tew-page .web-score small{font-size:1.4cqw;color:var(--mut)}
body.tew-page .dm.is-compact .web-phone{right:4%;bottom:6%}
body.tew-page .dm.is-compact .web-score{left:4%;bottom:6%}

/* ---------- Branding ---------- */
body.tew-page .br{position:absolute;inset:0;color:#fff;background:radial-gradient(70% 90% at 80% 0%,rgba(124,45,198,.45),transparent 70%)}
body.tew-page .br-grid{position:absolute;inset:0;width:100%;height:100%}
body.tew-page .br-grid *{fill:none;stroke:rgba(209,78,226,.5);stroke-width:.5;vector-effect:non-scaling-stroke}
body.tew-page .br-logo{position:absolute;left:50%;top:45%;display:grid;justify-items:center;gap:2cqw;transform:translate(-50%,-50%)}
body.tew-page .br-logo .iso{width:18cqw;height:18cqw;filter:drop-shadow(0 0 3cqw rgba(209,78,226,.55))}
body.tew-page .br-logo b{font:800 3.6cqw/1 var(--f-display);letter-spacing:-.03em}
body.tew-page .br-pal{position:absolute;left:5cqw;bottom:5cqw;display:flex;gap:1.4cqw}
body.tew-page .br-pal span{display:grid;align-items:end;width:9cqw;height:11cqw;padding:1cqw;border-radius:1.8cqw;background:var(--c);box-shadow:0 0 0 1px rgba(255,255,255,.14),0 2cqw 4cqw -1cqw rgba(0,0,0,.6)}
body.tew-page .br-pal i{font:600 1.1cqw/1 var(--f-body);font-style:normal;color:#fff;mix-blend-mode:difference}
body.tew-page .br-type{position:absolute;right:5cqw;bottom:5cqw;display:grid;justify-items:end}
body.tew-page .br-type b{font:800 9cqw/1 var(--f-display);letter-spacing:-.04em;background:var(--g);-webkit-background-clip:text;background-clip:text;color:transparent}
body.tew-page .br-type span{font-size:1.7cqw;color:var(--mut)}
body.tew-page .br-apps{position:absolute;inset:0}
body.tew-page .br-apps img{position:absolute;top:50%;left:50%;width:38%;aspect-ratio:4/3;object-fit:cover;border-radius:2cqw;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 3cqw 6cqw rgba(0,0,0,.6)}
body.tew-page .br-book{position:absolute;left:50%;top:50%;width:34%;aspect-ratio:3/4;transform:translate(-50%,-50%)}
body.tew-page .br-book span{position:absolute;inset:0;border-radius:1.6cqw}
body.tew-page .br-book .pg{background:#e9e5ef;box-shadow:0 1cqw 3cqw rgba(0,0,0,.4)}
body.tew-page .br-book .cv{z-index:2;display:grid;place-content:center;justify-items:center;gap:2cqw;background:radial-gradient(90% 70% at 100% 0%,rgba(209,78,226,.6),transparent 60%),#1c1030;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 3cqw 6cqw rgba(0,0,0,.6);transform-origin:left}
body.tew-page .br-book .cv .iso{width:9cqw;height:9cqw}
body.tew-page .br-book .cv b{font:700 2cqw/1.2 var(--f-display);text-align:center}

/* ---------- Tienda (modo oscuro) ---------- */
body.tew-page .shop{color:var(--tx)}
body.tew-page .sh-top{position:absolute;left:0;right:0;top:0;z-index:3;display:flex;justify-content:space-between;align-items:center;height:18cqw;padding:8cqw 5cqw 0;background:#0e0a17}
body.tew-page .sh-top b{font:800 4.4cqw/1 var(--f-display);color:#fff}
body.tew-page .sh-cart{position:relative;display:grid;place-items:center;color:#fff}
body.tew-page .sh-cart .i{width:6.2cqw;height:6.2cqw}
body.tew-page .sh-cart .badge{position:absolute;right:-2cqw;top:-2cqw;display:grid;place-items:center;width:5cqw;height:5cqw;border-radius:50%;background:var(--g);color:#fff;font:700 3cqw/1 var(--f-body);font-style:normal;transform:scale(0)}
body.tew-page .sh-gal{position:absolute;left:4cqw;right:4cqw;top:19cqw;aspect-ratio:1;overflow:hidden;border-radius:5cqw;background:var(--s2)}
body.tew-page .sh-track{display:flex;width:200%;height:100%}
body.tew-page .sh-track img{width:50%;height:100%;object-fit:cover}
body.tew-page .sh-info{position:absolute;left:0;right:0;top:calc(19cqw + 92cqw);display:grid;gap:2.6cqw;padding:3cqw 5cqw}
body.tew-page .sh-info>b{font:700 5.2cqw/1.1 var(--f-display);color:#fff}
body.tew-page .sh-price{font:800 6cqw/1 var(--f-display);background:var(--g);-webkit-background-clip:text;background-clip:text;color:transparent}
body.tew-page .sizes{display:flex;gap:2cqw}
body.tew-page .sizes i{display:grid;place-items:center;width:10cqw;height:8cqw;border-radius:2.4cqw;border:1px solid var(--line);font:600 3cqw/1 var(--f-body);font-style:normal;color:var(--tx)}
body.tew-page .sh-add{position:relative;display:grid;place-items:center;height:12cqw;border-radius:99px;background:#fff;color:#0e0a17;font:700 4cqw/1 var(--f-body);overflow:hidden}
body.tew-page .sh-add em{position:absolute;font-style:normal}
body.tew-page .sh-add .t2{opacity:0;color:#fff}
body.tew-page .sh-sheet{position:absolute;left:0;right:0;bottom:0;z-index:5;display:grid;gap:3cqw;padding:6cqw 5cqw 8cqw;border-radius:7cqw 7cqw 0 0;background:var(--s2);box-shadow:0 0 0 1px var(--line),0 -4cqw 10cqw rgba(0,0,0,.5)}
body.tew-page .sh-sheet>b{font:700 5cqw/1 var(--f-display);color:#fff}
body.tew-page .sh-opt{display:flex;align-items:center;gap:3cqw;height:12cqw;padding:0 4cqw;border-radius:3.4cqw;border:1px solid var(--line);font:600 3.8cqw/1 var(--f-body);color:var(--tx)}
body.tew-page .sh-opt i{width:4.4cqw;height:4.4cqw;border-radius:50%;border:.6cqw solid rgba(255,255,255,.25)}
body.tew-page .sh-opt.o1.on{border-color:#d14ee2;background:rgba(209,78,226,.1)}
body.tew-page .sh-opt.o1.on i{border-color:#d14ee2;background:radial-gradient(circle,#d14ee2 45%,transparent 50%)}
body.tew-page .pay{display:grid;place-items:center;height:13cqw;border-radius:99px;background:var(--g);color:#fff;font:700 4.2cqw/1 var(--f-body);box-shadow:0 2cqw 5cqw -2cqw var(--glow)}
body.tew-page .sh-done{position:absolute;inset:0;z-index:6;display:grid;place-content:center;justify-items:center;gap:4cqw;padding:10cqw;text-align:center;background:radial-gradient(60% 40% at 50% 35%,rgba(124,45,198,.35),transparent 70%),#0e0a17}
body.tew-page .sh-done svg{width:26cqw;height:26cqw;filter:drop-shadow(0 0 3cqw rgba(209,78,226,.6))}
body.tew-page .sh-done circle{fill:none;stroke:#d14ee2;stroke-width:3;stroke-dasharray:145;stroke-dashoffset:145}
body.tew-page .sh-done path{fill:none;stroke:#fff;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40}
body.tew-page .sh-done>b{font:800 6cqw/1.1 var(--f-display);color:#fff}
body.tew-page .sh-done small{font-size:3.6cqw;color:var(--mut)}
body.tew-page .road{position:relative;width:70cqw;height:1cqw;border-radius:99px;background:var(--sk)}
body.tew-page .truck{position:absolute;left:0;top:50%;display:grid;place-items:center;width:9cqw;height:9cqw;margin-top:-4.5cqw;border-radius:50%;background:var(--g);color:#fff;font-style:normal;box-shadow:0 0 3cqw var(--glow)}
body.tew-page .truck .i{width:4.6cqw;height:4.6cqw}

/* ---------- B2B ---------- */
body.tew-page .spec{position:absolute;inset:0;z-index:4;display:grid;align-content:start;gap:1.4cqw;padding:4cqw 5cqw;background:#100b1a}
body.tew-page .spec>b{margin-bottom:1.4cqw;font:800 3.6cqw/1.1 var(--f-display);letter-spacing:-.02em;color:#fff}
body.tew-page .spec .tr{display:flex;justify-content:space-between;padding:1.6cqw 2cqw;border-radius:1.4cqw;background:rgba(255,255,255,.04);font-size:1.8cqw}
body.tew-page .spec .tr i{font-style:normal;color:var(--mut)}
body.tew-page .spec .tr i+i{color:#fff;font-weight:600}
body.tew-page .spec .pg-btn{margin-top:2cqw}
body.tew-page .crm{position:absolute;inset:0;z-index:6;display:grid;grid-template-columns:repeat(3,1fr);gap:2cqw;padding:3cqw 4cqw;background:#100b1a}
body.tew-page .crm .col{border-radius:2cqw;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px var(--line);padding:2cqw}
body.tew-page .crm .col span{font:700 1.5cqw/1 var(--f-display);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
body.tew-page .deal{position:absolute;top:10cqw;left:6cqw;width:calc((100% - 12cqw) / 3);display:grid;gap:.6cqw;padding:2cqw;border-radius:1.8cqw;color:#fff;background:var(--s3);box-shadow:0 0 0 1px rgba(209,78,226,.35),0 2cqw 5cqw -1cqw rgba(0,0,0,.7);border-left:.6cqw solid #d14ee2}
body.tew-page .deal b{font:700 2cqw/1.2 var(--f-display)}
body.tew-page .deal small{font-size:1.5cqw;color:var(--mut)}
body.tew-page .deal .won{font:700 1.6cqw/1 var(--f-body);font-style:normal;color:#4ee38f;opacity:0}

/* ---------- Portada: tarjetas con la demo compacta ---------- */
body.tew-page .sv-vis.sv-demo{display:grid;place-items:center;overflow:hidden}
body.tew-page .sb-card .sv-demo>*{width:100%;height:100%}
body.tew-page .sb-big .sv-demo{flex:1 1 auto;min-height:420px}
body.tew-page .sb-big .sv-demo .dv-canvas{aspect-ratio:auto;height:100%}

/* ---------- Sección «Así funciona» ---------- */
body.tew-page .demo-head{max-width:720px;margin-bottom:clamp(36px,5vw,64px)}
@media (max-width:900px){
  body.tew-page .dm:not(.is-compact){grid-template-columns:minmax(0,1fr);gap:28px}
  body.tew-page .dm:not(.is-compact) .dm-stage{order:-1;margin-bottom:12px}
  body.tew-page .dm:not(.is-compact) .dv,body.tew-page .dm:not(.is-compact) .dv-phone{transform:none}
}
@media (max-width:600px){
  body.tew-page .dm:not(.is-compact) .dm-steps li:not(.is-on){display:none}
  body.tew-page .dm:not(.is-compact) .g-kpi{right:0}
  body.tew-page .dm:not(.is-compact) .dv-toast{right:0}
}
@media (prefers-reduced-motion:reduce){body.tew-page .dv{animation:none}}

/* Sin JS (editor de Elementor): se ve la escena base, sin capas superpuestas */
html.no-js body.tew-page .dm :is(.dv-page,.ig-chat,.sh-sheet,.sh-done,.spec,.crm,.dv-toast,.dv-cur,.br-apps,.br-book,.web-real,.web-phone){display:none}

/* =====================================================================
   TEMA CLARO en el interior de los dispositivos (petición del cliente, 29/9/2026):
   pantallas, burbujas y tarjetas en blanco para que resalte el texto.
   El marco, la profundidad y el resplandor siguen siendo oscuros.
   ===================================================================== */
body.tew-page .dv,body.tew-page .dm-stage{--tx:#1b1526;--mut:#7a7288;--line:rgba(27,21,38,.1);--sk:#e8e3ee;--s2:#fff;--s3:#fff}
body.tew-page .dv{color:var(--tx)}
body.tew-page .dv-browser,body.tew-page .dv-canvas{background:#f6f4f9}
body.tew-page .dv-bar{background:#ece8f1;border-bottom-color:#e0dae7}
body.tew-page .dv-bar i{background:#cdc5d8}
body.tew-page .dv-url{background:#fff;color:var(--mut)}
body.tew-page .dv-screen{background:#f6f4f9}
body.tew-page .dv-screen::before{background:#15101f}

/* Cursor oscuro sobre fondo claro */
body.tew-page .dv-cur path{fill:#1b1526;stroke:#fff}

/* Tarjetas flotantes en blanco */
body.tew-page .dv-toast,body.tew-page .g-kpi,body.tew-page .web-score{color:var(--tx);background:rgba(255,255,255,.94);box-shadow:0 0 0 1px rgba(27,21,38,.06),0 3cqw 7cqw -2cqw rgba(20,8,40,.55),0 0 10cqw -3cqw var(--glow)}
body.tew-page .dv-toast small,body.tew-page .g-kpi span,body.tew-page .g-kpi small,body.tew-page .web-score small{color:var(--mut)}
body.tew-page .bud{background:#ece8f1}
body.tew-page .web-score .bg{stroke:#ece8f1}
body.tew-page .web-score b{color:#1fae5b}
body.tew-page .web-score .fg{stroke:#1fae5b;filter:none}

/* Buscador */
body.tew-page .g-search{background:#fff;box-shadow:0 0 0 1px var(--line),0 .6cqw 2cqw rgba(27,21,38,.06);color:var(--tx)}
body.tew-page .g-fav{background:#ddd6e6}
body.tew-page .g-u em{color:var(--tx)}
body.tew-page .g-row b{color:#5a2bd4}
body.tew-page .g-row.you,body.tew-page .g-row.pat{background:#fff;border-color:rgba(209,78,226,.55);box-shadow:0 1.4cqw 4cqw -1cqw rgba(160,64,220,.4)}
body.tew-page .g-row.you b,body.tew-page .g-row.pat b{color:var(--tx)}
body.tew-page .pat-links i{color:#5a2bd4;background:#f1ebfb}

/* Página de destino */
body.tew-page .dv-page,body.tew-page .spec{background:#fff}

/* Google Maps (mapa claro) */
body.tew-page .mp{background:radial-gradient(circle,rgba(27,21,38,.08) 1px,transparent 1.2px) 0 0/3cqw 3cqw,radial-gradient(60% 70% at 55% 45%,rgba(209,78,226,.14),transparent 70%),#eceef2}
body.tew-page .mp-roads path{stroke:#fff}
body.tew-page .pin{background:#b9b1c6}
body.tew-page .mp-card{color:var(--tx);background:rgba(255,255,255,.96);box-shadow:0 0 0 1px rgba(27,21,38,.06),0 3cqw 7cqw -2cqw rgba(20,8,40,.45)}
body.tew-page .mp-card small{color:#1e8e3e}
body.tew-page .mp-card small b{color:var(--tx)}
body.tew-page .dm-stars{color:#e3dde9}
body.tew-page .mp-acts i{background:#f4f1f8;color:var(--tx)}

/* Instagram y chat: burbujas blancas */
body.tew-page .ig-top,body.tew-page .ig-feed{background:#fff}
body.tew-page .ig-top b,body.tew-page .ig-top .i,body.tew-page .ig-h b,body.tew-page .ig-likes{color:var(--tx)}
body.tew-page .ig-h>i.te,body.tew-page .ch-h .te{box-shadow:0 0 0 .6cqw #fff,0 0 0 1.1cqw #d14ee2}
body.tew-page .ig-img{background:var(--sk)}
body.tew-page .ig-chat{background:#efeae2}
body.tew-page .ch-h{background:#fff}
body.tew-page .ch-h>.i,body.tew-page .ch-h b{color:var(--tx)}
body.tew-page .dm-bub{background:#fff;color:var(--tx);box-shadow:0 .6cqw 1.6cqw rgba(27,21,38,.08)}
body.tew-page .dm-bub.me{color:#fff}
body.tew-page .ch-body .dm-typing{background:#fff}

/* Diseño web */
body.tew-page .wf>span{background:#efeaf5;border-color:rgba(124,45,198,.35)}

/* Branding (lienzo claro) */
body.tew-page .br{color:var(--tx);background:radial-gradient(70% 90% at 80% 0%,rgba(209,78,226,.16),transparent 70%)}
body.tew-page .br-grid *{stroke:rgba(124,45,198,.35)}
body.tew-page .br-type span{color:var(--mut)}

/* Tienda */
body.tew-page .sh-top{background:#fff}
body.tew-page .sh-top b,body.tew-page .sh-cart,body.tew-page .sh-info>b,body.tew-page .sh-sheet>b,body.tew-page .sh-done>b{color:var(--tx)}
body.tew-page .sh-add{background:#1b1526;color:#fff}
body.tew-page .sh-sheet{background:#fff;box-shadow:0 -3cqw 8cqw rgba(27,21,38,.18)}
body.tew-page .sh-opt i{border-color:#cfc8d8}
body.tew-page .sh-done{background:radial-gradient(60% 40% at 50% 35%,rgba(209,78,226,.12),transparent 70%),#fff}
body.tew-page .sh-done path{stroke:#7c2dc6}

/* B2B */
body.tew-page .spec>b,body.tew-page .spec .tr i+i{color:var(--tx)}
body.tew-page .spec .tr{background:#f5f2f8}
body.tew-page .crm{background:#f6f4f9}
body.tew-page .crm .col{background:#ece8f1;box-shadow:none}
body.tew-page .deal{color:var(--tx);background:#fff;box-shadow:0 0 0 1px rgba(209,78,226,.25),0 1.4cqw 3.6cqw -1cqw rgba(20,8,40,.3)}
body.tew-page .deal .won{color:#1e8e3e}
body.tew-page .pg-hero{background:radial-gradient(90% 140% at 100% 0%,rgba(209,78,226,.45),transparent 60%),#1b1526;color:#fff}
body.tew-page .sb-big .sv-demo{min-height:0}body.tew-page .sb-big .sv-demo .dv-canvas{aspect-ratio:16/10.6;height:auto}