/* =========================================================
   SOZIAL · Landing  —  estilos
   Cambia los colores de marca en :root
   ========================================================= */
:root{
  --bg:#0b0716;
  --bg-2:#0e0a1c;
  --panel:#120c22;
  --panel-2:#1a1230;
  --paper:#f5f0ff;
  --hl:#bd8aff;            /* palabra resaltada */
  --accent:#9759ff;        /* violeta principal */
  --accent-2:#733acd;
  --muted:#b4a9c6;
  --line:#ffffff1a;
  --line-2:#ffffff2e;
  --ok:#41e0a4;
  --warn:#ffb547;
  --radius:24px;
  --ff-d:"Syne",system-ui,sans-serif;
  --ff-b:"Manrope",system-ui,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}
@property --ang{syntax:"<angle>";initial-value:0deg;inherits:false}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--paper);font-family:var(--ff-b);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;
  background-image:radial-gradient(70% 700px at 88% 270px,rgba(58,25,97,.32),transparent 90%)}
img,svg,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
p{margin:0}
h1,h2,h3,h4{margin:0;font-family:var(--ff-d);font-weight:700;letter-spacing:-.055em;line-height:1.08}
:focus-visible{outline:2px solid var(--hl);outline-offset:3px;border-radius:8px}
.wrap{width:min(1180px,100% - 32px);margin-inline:auto}
.hl{color:var(--hl)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- piezas comunes ---------- */
.kicker{display:inline-flex;align-items:center;gap:8px;font-size:.75rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#b68bea}
.kicker .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent)}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--line-2);background:rgba(151,89,255,.07);font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#d9c6ff}
.chip .dot{width:7px;height:7px;border-radius:50%;background:var(--hl)}
@keyframes pulse{50%{transform:scale(.55);opacity:.5}}
.h2{font-size:clamp(2rem,4.7vw,3.1rem)}
.sub{color:var(--muted);font-size:1rem;max-width:62ch}
.sub b,.lead b{color:var(--paper)}
.center{text-align:center}

.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:0 28px;border-radius:12px;font-size:.92rem;font-weight:700;color:#fff;
  background:linear-gradient(120deg,#8a45e6,#6a2fd0);box-shadow:0 6px 35px rgba(136,57,233,.35),inset 0 1px 0 rgba(255,255,255,.24);transition:transform .25s var(--ease),box-shadow .25s;overflow:hidden;isolation:isolate}
.btn-main::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);background-size:250% 100%;animation:sweep 4s ease-in-out infinite}
@keyframes sweep{0%,55%{background-position:160% 0}100%{background-position:-60% 0}}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 50px rgba(136,57,233,.55),inset 0 1px 0 rgba(255,255,255,.24)}
.btn .arr{font-size:1.05rem;transition:transform .25s var(--ease)}
.btn:hover .arr{transform:translate(3px,-3px)}
.btn-wide{width:min(420px,100%)}
.btn-note{display:block;margin-top:12px;font-size:.78rem;color:var(--muted)}

.js .rv{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.1s}.rv.d2{transition-delay:.2s}.rv.d3{transition-delay:.3s}

.section{padding:110px 0}

/* ---------- HEADER ---------- */
.top{padding:26px 0 18px}
.logo{display:inline-flex;align-items:center;gap:10px}
.logo-mark{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(140deg,#b07bff,var(--accent) 55%,#5c22c4);box-shadow:0 0 24px -6px var(--accent),inset 0 1px 0 rgba(255,255,255,.3)}
.logo-mark svg{width:22px;height:22px}
.logo-txt{font-family:var(--ff-d);font-weight:800;line-height:.9;font-size:1.05rem;letter-spacing:-.02em;text-transform:uppercase}
.logo-txt small{display:block;font-size:.55rem;letter-spacing:.02em;color:var(--hl)}
.logo-txt b{color:var(--hl)}
.logo-bg{display:inline-block;flex:none;background:#3b0a75 url(media/logo-sozial.webp) 44% 46%/186% no-repeat}
.logo-img{width:52px;height:52px;border-radius:12px;box-shadow:0 0 30px -8px var(--accent),0 0 0 1px rgba(255,255,255,.1)}
.logo-sub{font-size:.62rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);line-height:1.35}
.logo-sub b{color:var(--hl)}

/* ---------- HERO ---------- */
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;padding:30px 0 70px;min-height:620px}
.hero h1{font-size:clamp(2.2rem,4.3vw,3.5rem);margin:18px 0 20px;letter-spacing:-.055em}
.hero .lead{color:var(--muted);font-size:.95rem;max-width:52ch}
.tools{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.tool{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.03);font-size:.78rem;font-weight:700}
.tool span{color:var(--muted);font-weight:500}
.tool svg{width:16px;height:16px}

.vsl{position:relative;justify-self:center;width:min(340px,100%);aspect-ratio:9/16;border-radius:26px;padding:6px;background:linear-gradient(160deg,rgba(189,138,255,.5),rgba(151,89,255,.08) 40%,rgba(151,89,255,.35));box-shadow:0 30px 90px -20px rgba(151,89,255,.6),0 0 0 1px rgba(255,255,255,.06)}
.vsl-screen{position:relative;width:100%;height:100%;border-radius:21px;overflow:hidden;background:#140c26}
.vsl-screen video{width:100%;height:100%;object-fit:cover}
.vsl-ph{position:absolute;inset:0;background:radial-gradient(circle at 50% 75%,#3a1d6e,#140c26 70%)}
.vsl-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:74% 20%}
.vsl-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,7,22,.7),transparent 30%,transparent 62%,rgba(11,7,22,.75))}
.vsl-ph .scan{position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.025) 3px 4px)}
.vsl-ph .lightbar{position:absolute;top:-30%;left:-60%;width:40%;height:160%;background:linear-gradient(90deg,transparent,rgba(189,138,255,.25),transparent);transform:rotate(18deg);animation:lightbar 5s ease-in-out infinite}
@keyframes lightbar{0%{left:-60%}60%,100%{left:130%}}
.vsl-top{position:absolute;top:14px;left:14px;right:14px;z-index:2}
.vsl-top small{display:block;font-size:.5rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700}
.vsl-top b{font-family:var(--ff-d);font-size:.95rem;letter-spacing:-.03em}
.vsl-mini{position:absolute;top:58px;left:14px;z-index:2;width:118px;padding:6px;border-radius:12px;background:rgba(20,12,38,.8);border:1px solid var(--line-2);backdrop-filter:blur(8px);animation:miniIn 6s var(--ease) infinite}
.vsl-mini i{display:block;height:84px;border-radius:8px;background:linear-gradient(150deg,#7d3df0,#2b1258);position:relative;overflow:hidden}
.vsl-mini i::after{content:"";position:absolute;left:50%;bottom:0;width:46px;height:60px;transform:translateX(-50%);border-radius:24px 24px 0 0;background:rgba(255,255,255,.18)}
.vsl-mini span{display:block;margin-top:6px;font-size:.5rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
@keyframes miniIn{0%,8%{opacity:0;transform:translateY(-10px) scale(.95)}16%,84%{opacity:1;transform:none}92%,100%{opacity:0}}
.vsl-play{position:absolute;left:50%;top:50%;z-index:3;transform:translate(-50%,-50%);width:66%;padding:18px 16px 20px;border-radius:14px;text-align:center;background:linear-gradient(160deg,#7436e0,#5b21c4);box-shadow:0 18px 60px -10px rgba(124,61,240,.8),inset 0 1px 0 rgba(255,255,255,.3);animation:vslPulse 2.4s ease-in-out infinite}
.vsl-play small{display:block;font-size:.66rem;font-weight:600;}
.vsl-play svg{width:30px;height:30px;margin:12px auto}
.vsl-play b{display:block;font-family:var(--ff-d);font-size:1.15rem;line-height:1.1;letter-spacing:-.03em}
@keyframes vslPulse{50%{box-shadow:0 18px 80px 0 rgba(124,61,240,.95),inset 0 1px 0 rgba(255,255,255,.3);transform:translate(-50%,-50%) scale(1.03)}}
.vsl-bar{display:none;position:absolute;left:14px;right:14px;bottom:14px;height:3px;border-radius:3px;background:rgba(255,255,255,.15);z-index:2;overflow:hidden}
.vsl.has-video .vsl-bar{display:block}
.vsl-bar i{display:block;height:100%;width:30%;background:var(--hl);animation:vbar 10s linear infinite}
@keyframes vbar{from{width:0}to{width:100%}}


/* ---------- MARQUEE ---------- */
.mq{overflow:hidden;border-block:1px solid var(--line);background:rgba(18,12,34,.6);padding:16px 0;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.mq-track{display:flex;width:max-content;animation:scMarquee 40s linear infinite}
.mq-track span{white-space:nowrap;padding-right:28px;font-family:var(--ff-d);font-weight:700;font-size:1rem;letter-spacing:-.02em;color:#d8c8f5}
.mq-track span i{font-style:normal;color:var(--accent);margin-left:28px}
@keyframes scMarquee{to{transform:translateX(-50%)}}

/* ---------- SHOWCASE ---------- */
.showcase{position:relative;padding:90px 0 60px;overflow:hidden}
.sc-head{position:relative;display:grid;justify-items:center;gap:16px;text-align:center;margin-bottom:46px}
.sc-player{display:grid;grid-template-columns:auto 1fr;gap:56px;align-items:center;justify-content:center;max-width:960px;margin-inline:auto}
.sc-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;width:min(340px,82vw)}
.sc-tag{padding:7px 14px;border-radius:999px;background:#6b2bd9;font-size:.62rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 0 24px -4px var(--accent)}
.sc-time{font-size:.72rem;color:var(--muted);font-variant-numeric:tabular-nums}
.sc-frame{position:relative;width:min(340px,82vw);aspect-ratio:9/14;border-radius:24px;padding:5px;background:linear-gradient(170deg,rgba(189,138,255,.55),rgba(151,89,255,.1) 45%,rgba(151,89,255,.4));box-shadow:0 40px 100px -30px rgba(151,89,255,.7)}
.sc-screen{position:relative;width:100%;height:100%;border-radius:20px;overflow:hidden;background:#120a22}
.sc-shine{position:absolute;inset:0;z-index:5;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.14) 48%,transparent 56%);background-size:250% 100%;animation:sweep 5s ease-in-out infinite}
.sc-progress{position:absolute;left:14px;right:14px;bottom:12px;z-index:6;height:3px;border-radius:3px;background:rgba(255,255,255,.14);overflow:hidden}
.sc-progress i{display:block;height:100%;width:0;background:var(--hl)}
.sc-ctrls{display:flex;align-items:center;gap:12px;margin-top:18px}
.sc-btn{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line-2);background:rgba(255,255,255,.03);transition:background .2s}
.sc-btn:hover{background:rgba(151,89,255,.2)}
.sc-btn.main{width:52px;height:52px;background:var(--accent);border-color:transparent;box-shadow:0 0 30px -6px var(--accent)}
.sc-btn svg{width:18px;height:18px}
.auto{display:inline-flex;align-items:center;gap:10px;margin-left:18px;font-size:.84rem;color:var(--muted)}
.sw{position:relative;width:40px;height:22px;border-radius:99px;background:rgba(255,255,255,.12);transition:background .3s}
.sw::before{content:"";position:absolute;inset:-11px -4px}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .35s var(--ease)}
.sw[aria-checked="true"]{background:var(--accent)}
.sw[aria-checked="true"]::after{transform:translateX(18px)}
.sc-info .num{font-family:var(--ff-d);font-size:.95rem;color:var(--muted)}
.sc-info .num b{color:var(--paper)}
.sc-info h3{font-size:clamp(2.2rem,4.8vw,3.4rem);margin:14px 0 28px;min-height:2.2em}
.sc-next{display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.03);max-width:300px;width:100%;text-align:left;transition:border-color .2s}
.sc-next:hover{border-color:var(--line-2)}
.sc-next .th{width:34px;height:46px;border-radius:6px;background:linear-gradient(150deg,var(--accent),#2b1258);flex:none}
.sc-next small{display:block;font-size:.7rem;color:var(--muted)}
.sc-next b{font-size:.88rem}
.sc-next .go{margin-left:auto;color:var(--muted)}
.sc-all{margin-top:56px}
.sc-all-head{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:baseline;margin-bottom:16px}
.sc-all-head b{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--hl)}
.sc-all-head span{font-size:.78rem;color:var(--muted)}
.sc-thumbs{display:grid;grid-template-columns:repeat(10,1fr);gap:10px}
.thumb{position:relative;border-radius:12px;border:1px solid var(--line);background:var(--panel);padding:6px 6px 10px;text-align:left;transition:transform .3s var(--ease),border-color .3s,box-shadow .3s}
.thumb:hover{transform:translateY(-4px);border-color:var(--line-2)}
.thumb.on{border-color:var(--hl);box-shadow:0 0 0 1px var(--hl),0 10px 30px -10px var(--accent)}
.thumb .mini{position:relative;aspect-ratio:9/12;border-radius:8px;overflow:hidden;background:#120a22}
.thumb .mini .slide{transform:scale(.3);transform-origin:0 0;width:333.33%;height:333.33%;position:absolute;inset:0;opacity:1!important}
.thumb .n{display:block;margin-top:8px;font-size:.6rem;color:var(--muted);font-weight:700}
.thumb .t{display:block;font-size:.72rem;font-weight:700;line-height:1.2}
@media (max-width:900px){
  .sc-player{grid-template-columns:1fr;justify-items:center;text-align:center;gap:28px}
  .sc-info h3{min-height:0;margin-bottom:18px}
  .sc-next{margin-inline:auto}
  .sc-thumbs{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:104px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory}
  .thumb{scroll-snap-align:start}
}

/* --- diapositivas del showcase (motion graphics hechos en CSS) --- */
.slide{position:absolute;inset:0;opacity:0;transition:opacity .5s;padding:26px 22px;display:flex;flex-direction:column;overflow:hidden}
.slide.on{opacity:1}
.slide .eyb{font-size:.6rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--hl)}
.slide .ttl{font-family:var(--ff-d);font-weight:800;font-size:1.6rem;line-height:.98;letter-spacing:-.04em;text-transform:uppercase;margin-top:6px}
.slide .bgimg{position:absolute;inset:0;z-index:-1}
.slide .person{position:absolute;left:50%;bottom:-4px;width:70%;transform:translateX(-50%);color:rgba(255,255,255,.12)}
/* keyframes compartidos por las fases */
@keyframes word{0%{opacity:0;transform:translateY(12px) scale(.9)}6%,80%{opacity:1;transform:none}90%,100%{opacity:0}}
@keyframes pop{0%{transform:rotate(-6deg) scale(0)}10%,85%{transform:rotate(-6deg) scale(1)}100%{transform:rotate(-6deg) scale(0)}}
@keyframes ringOut{from{transform:scale(.5);opacity:1}to{transform:scale(1.4);opacity:0}}
@keyframes qIn{0%{opacity:0;transform:translateY(30px)}12%,88%{opacity:1;transform:none}100%{opacity:0}}
@keyframes spinR{to{transform:rotate(360deg)}}

/* ---------- MID CTA ---------- */
.mid-cta{text-align:center;padding:40px 0 10px}

/* ---------- MÉTODO / EDITOR ---------- */
.method-head{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:end;margin-bottom:40px}
.method-head h2{margin-top:14px}
.method-head h2 .caps{text-transform:uppercase}
.method-head p{color:var(--muted);font-size:1rem;max-width:56ch}
.editor{border-radius:24px;border:1px solid var(--line-2);background:linear-gradient(180deg,#160e2b,#0f0a1e);padding:22px;box-shadow:0 40px 100px -40px rgba(151,89,255,.5)}
.ed-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.ed-brand{display:flex;align-items:center;gap:12px;font-family:var(--ff-d);font-weight:800;font-size:1rem;letter-spacing:.02em}
.ed-brand b{color:var(--hl)}
.db-logo{width:38px;height:38px;border-radius:10px;box-shadow:0 0 22px -4px var(--accent)}
.ed-status{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--line-2);background:rgba(151,89,255,.1);font-size:.74rem;font-weight:700;transition:background .4s,border-color .4s}
.ed-status i{width:8px;height:8px;border-radius:50%;background:var(--hl);box-shadow:0 0 10px var(--hl);animation:pulse 1.4s ease-in-out infinite}
.ed-status.done{border-color:rgba(65,224,164,.45);background:rgba(65,224,164,.12)}
.ed-status.done i{background:var(--ok);box-shadow:0 0 10px var(--ok);animation:none}
.ed-req{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.ed-req .me{padding:4px 8px;border-radius:6px;background:rgba(255,255,255,.08);font-size:.62rem;font-weight:800}
.ed-req .txt{font-size:.84rem;flex:1;min-height:1.3em}
.ed-req .txt::after{content:"";display:inline-block;width:2px;height:1em;background:var(--hl);vertical-align:-2px;margin-left:2px;animation:blink 1s steps(1) infinite}
.ed-req .send{width:24px;height:24px;border-radius:50%;background:var(--accent);display:grid;place-items:center;flex:none}
.ed-req .send svg{width:12px;height:12px}
.db-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0 16px}
.db-step{position:relative;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid var(--line);color:var(--muted);transition:.4s;overflow:hidden}
.db-step::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:linear-gradient(90deg,var(--accent),var(--hl))}
.db-step.on::after{animation:stepBar 1.9s linear forwards}
@keyframes stepBar{to{width:100%}}
.db-step b{width:24px;height:24px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:.68rem;border:1px solid var(--line-2);transition:.4s}
.db-step strong{display:block;font-size:.8rem;line-height:1.2}
.db-step small{display:block;font-size:.64rem;line-height:1.3;opacity:0;max-height:0;transition:opacity .4s,max-height .4s}
.db-step.on{border-color:var(--hl);color:var(--paper);background:rgba(151,89,255,.14);box-shadow:0 0 24px -10px var(--accent)}
.db-step.on b{background:var(--accent);border-color:transparent;color:#fff}
.db-step.ok{color:var(--paper)}
.db-step.ok b{background:var(--ok);color:#06281a;border-color:transparent}
.db-step.on small,.db-step.ok small{opacity:1;max-height:2.6em;color:var(--muted)}
.db-grid{display:grid;grid-template-columns:220px 1fr;gap:16px}
.db-kpis{display:grid;gap:10px;align-content:start}
.db-kpi{padding:14px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.025)}
.db-kpi small{display:block;font-size:.6rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.db-kpi b{display:block;font-family:var(--ff-d);font-size:1.7rem;line-height:1.15;margin:4px 0 2px;font-variant-numeric:tabular-nums}
.db-kpi em{font-style:normal;font-size:.68rem;font-weight:700;color:var(--muted);transition:color .3s}
.db-kpi em.up{color:var(--ok)}
.db-kpi.flash{animation:kpiFlash .7s var(--ease)}
@keyframes kpiFlash{30%{border-color:rgba(65,224,164,.55);box-shadow:0 0 26px -8px var(--ok)}}
.db-chart{border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.025);padding:14px;display:flex;flex-direction:column;min-height:270px}
.db-chart-hd{display:flex;justify-content:space-between;align-items:center;font-size:.7rem;font-weight:700;color:var(--muted);margin-bottom:10px;flex-wrap:wrap;gap:8px}
.db-legend{display:inline-flex;align-items:center;gap:6px}
.db-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;background:linear-gradient(0deg,#7c3df0,var(--hl))}
.db-legend i.l{width:14px;height:2px;border-radius:2px;background:var(--ok);margin-left:8px}
.db-plot{position:relative;flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px);background-size:100% 25%}
.db-band{position:relative;display:flex;flex-direction:column;border-radius:10px;transition:background .5s}
.db-band.on{background:rgba(151,89,255,.1)}
.db-band.ok{background:rgba(255,255,255,.02)}
.db-bars{flex:1;display:flex;align-items:flex-end;gap:12%;padding:8px 12% 0}
.db-bars i{flex:1;height:4%;border-radius:6px 6px 2px 2px;background:linear-gradient(0deg,rgba(124,61,240,.55),var(--hl));transition:height 1s cubic-bezier(.16,1,.3,1)}
.db-bars i:nth-child(2){transition-delay:.15s}.db-bars i:nth-child(3){transition-delay:.3s}
.db-band.grow .db-bars i{height:var(--h)}
.db-band[data-p="3"] .db-bars i{background:linear-gradient(0deg,rgba(47,207,148,.5),#7ff3c6)}
.db-band span{display:block;text-align:center;padding:8px 2px 4px;font-size:.62rem;font-weight:800;letter-spacing:.06em;color:var(--muted);transition:color .4s}
.db-band.on span,.db-band.ok span{color:var(--paper)}
.db-line{position:absolute;inset:8px 0 28px;width:100%;height:calc(100% - 36px);pointer-events:none;overflow:visible}
.db-line path{fill:none;stroke:var(--ok);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 6px rgba(65,224,164,.7));transition:stroke-dashoffset 1.6s cubic-bezier(.16,1,.3,1)}
.flow{margin-top:34px}
.flow-bar{display:grid;grid-template-columns:repeat(4,1fr);align-items:center;margin-bottom:16px;position:relative}
.flow-bar::before{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:var(--line)}
.flow-bar .fill{position:absolute;left:0;top:50%;height:2px;background:linear-gradient(90deg,var(--accent),var(--hl));transition:width .6s var(--ease)}
.flow-bar span{position:relative;justify-self:start;padding:4px 10px;border-radius:999px;background:var(--bg);border:1px solid var(--line-2);font-size:.62rem;font-weight:800;color:var(--muted);transition:.3s}
.flow-bar span.on{background:var(--accent);border-color:transparent;color:#fff}
.flow-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
/* tarjetas de cristal 01–04: activas por el dashboard o al pasar el mouse */
.flow-cards{perspective:1000px}
.fcard{position:relative;isolation:isolate;overflow:hidden;padding:12px 12px 18px;border-radius:20px;border:1px solid rgba(199,167,255,.14);background:linear-gradient(180deg,rgba(26,16,50,.92),#0f0a1e);box-shadow:0 22px 50px rgba(3,1,10,.5);cursor:default;outline:none;
  transform-style:preserve-3d;transition:transform .5s var(--ease),box-shadow .5s,border-color .5s,opacity .4s}
.fcard::after{content:"";position:absolute;inset:0;z-index:4;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.16) 48%,transparent 60%) no-repeat;background-size:260% 100%;background-position:120% 0}
.fcard .glare{position:absolute;inset:0;z-index:3;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;background:radial-gradient(260px circle at var(--gx,50%) var(--gy,0%),rgba(255,255,255,.16),transparent 55%)}
.fcard .ill{position:relative;height:160px;border-radius:14px;margin-bottom:16px;display:grid;place-items:center;overflow:hidden;
  background:radial-gradient(circle at 22% 18%,var(--c1),transparent 58%),radial-gradient(circle at 82% 88%,var(--c2),transparent 58%),#140c24;filter:saturate(.4) brightness(.7);transition:filter .6s}
.fcard .ill::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:18px 18px;mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 80%);-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 80%)}
.fcard .spark{position:absolute;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 8px 2px rgba(255,255,255,.6);opacity:.35}
.fcard.on .spark,.fcard.hov .spark{animation:sparkFloat 3.4s ease-in-out infinite}
@keyframes sparkFloat{50%{transform:translateY(-8px);opacity:.9}}
.gstack{position:relative;width:96px;height:96px;transform:translate3d(var(--tx,0),var(--ty,0),0);transition:transform .25s ease-out}
.gtile{position:absolute;inset:0;border-radius:26px;display:grid;place-items:center;transform:rotate(-6deg);
  background:linear-gradient(140deg,rgba(255,255,255,.28),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.34);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 18px 36px -10px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.55),inset 0 -10px 20px rgba(255,255,255,.04);transition:transform .6s var(--ease)}
.gtile::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(160deg,rgba(255,255,255,.38),transparent 45%);pointer-events:none}
.gtile.back{transform:translate(18px,-12px) rotate(10deg) scale(.82);opacity:.55;background:linear-gradient(140deg,rgba(255,255,255,.16),rgba(255,255,255,.02))}
.gtile svg{width:60px;height:60px;position:relative;filter:drop-shadow(0 4px 10px rgba(0,0,0,.35))}
.gchip{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;font-size:.66rem;background-color:rgba(12,7,26,.55);font-weight:800;letter-spacing:.02em;white-space:nowrap;
  background:linear-gradient(140deg,rgba(255,255,255,.22),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 8px 18px -8px rgba(0,0,0,.6);
  opacity:0;transition:opacity .45s,transform .6s var(--ease)}
.gchip b{width:6px;height:6px;border-radius:50%;background:#fff}
.gchip b.w{background:var(--warn);box-shadow:0 0 8px var(--warn)}.gchip b.g{background:var(--ok);box-shadow:0 0 8px var(--ok)}.gchip b.o{background:var(--hl);box-shadow:0 0 8px var(--hl)}
.gchip.tl{left:10px;top:10px;transform:translate(calc(var(--tx,0px) * -.6 - 8px),calc(var(--ty,0px) * -.6))}
.gchip.br{right:10px;bottom:10px;transform:translate(calc(var(--tx,0px) * -.6 + 8px),calc(var(--ty,0px) * -.6))}
.fcard h3{font-size:1.15rem;letter-spacing:-.03em;color:var(--muted);transition:color .4s}
.fcard p{font-size:.76rem;color:var(--muted);margin-top:4px;opacity:.7;transition:opacity .4s}
/* estado activo: lo marca el dashboard (.on) o el mouse/teclado (.hov) */
.fcard.on,.fcard.hov{border-color:rgba(226,210,255,.6);box-shadow:0 30px 60px rgba(3,1,10,.7),0 0 0 1px rgba(199,167,255,.35),0 0 50px rgba(151,89,255,.35)}
.fcard.on:not(.hov){transform:translateY(-6px)}
.fcard.on .ill,.fcard.hov .ill{filter:none}
.fcard.on .gtile:not(.back),.fcard.hov .gtile:not(.back){transform:rotate(0) translateY(-4px) scale(1.06)}
.fcard.on .gtile.back,.fcard.hov .gtile.back{transform:translate(24px,-16px) rotate(14deg) scale(.86);opacity:.75}
.fcard.on .gstack,.fcard.hov .gstack{animation:gtileFloat 3s ease-in-out infinite}
@keyframes gtileFloat{50%{translate:0 -6px}}
.fcard.on .gchip,.fcard.hov .gchip{opacity:1}
.fcard.on .gchip.tl,.fcard.hov .gchip.tl{transform:translate(calc(var(--tx,0px) * -.6),calc(var(--ty,0px) * -.6))}
.fcard.on .gchip.br,.fcard.hov .gchip.br{transform:translate(calc(var(--tx,0px) * -.6),calc(var(--ty,0px) * -.6))}
.fcard.on h3,.fcard.hov h3{color:var(--paper)}
.fcard.on p,.fcard.hov p{opacity:1}
.fcard.hov .glare{opacity:1}
.fcard.on::after,.fcard.hov::after{animation:sheenOnce 1.4s cubic-bezier(.2,.8,.2,1)}
@keyframes sheenOnce{to{background-position:-40% 0}}
/* mientras el mouse está sobre una tarjeta, las demás se apagan */
.flow-cards.has-hov .fcard:not(.hov){opacity:.55;border-color:rgba(199,167,255,.14);box-shadow:0 22px 50px rgba(3,1,10,.5);transform:none}
.flow-cards.has-hov .fcard:not(.hov) .ill{filter:saturate(.4) brightness(.7)}
.flow-cards.has-hov .fcard:not(.hov) .gchip{opacity:0}
.flow-cards.has-hov .fcard:not(.hov) .gstack{animation:none}
.flow-cards.has-hov .fcard:not(.hov) h3{color:var(--muted)}
.fcard:focus-visible{outline:2px solid var(--hl);outline-offset:3px}
.flow-cards.has-hov .fcard:not(.hov) .gtile:not(.back){transform:rotate(-6deg)}
.flow-cards.has-hov .fcard:not(.hov) .gtile.back{transform:translate(18px,-12px) rotate(10deg) scale(.82);opacity:.55}
@media (max-width:900px){
  .method-head{grid-template-columns:1fr}
  .db-steps{grid-template-columns:1fr 1fr}
  .db-grid{grid-template-columns:1fr}
  .db-kpis{grid-template-columns:repeat(3,1fr)}
  .db-kpi b{font-size:1.25rem}
  .flow-cards{grid-template-columns:1fr 1fr}
}
@media (max-width:520px){.db-kpis{grid-template-columns:1fr}.db-band span{font-size:.5rem;letter-spacing:0}}

/* ---------- EVO (tú vendes / Sozial ejecuta) ---------- */
.evo{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.evo-art{position:relative;aspect-ratio:4/5;border-radius:24px;overflow:hidden;border:1px solid var(--line-2);background:#090613;box-shadow:0 40px 100px -40px rgba(151,89,255,.6)}
.evo-art .poster,.evo-art canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.evo-art.ready .poster{visibility:hidden}
.evo-msg{position:absolute;left:16px;right:16px;bottom:16px;z-index:3;padding:12px 14px;border-radius:14px;background:rgba(9,6,19,.74);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line-2);display:flex;align-items:center;gap:12px;transition:border-color .5s}
.evo-msg .ic{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;flex:none;background:rgba(255,181,71,.15);color:var(--warn);transition:.5s}
.evo-msg .ic svg{width:18px;height:18px}
.evo-msg b{display:block;font-size:.86rem;line-height:1.3}
.evo-msg small{font-size:.72rem;color:var(--muted)}
.evo-msg .tx{transition:opacity .3s}
.evo-art.is-ai .evo-msg{border-color:rgba(65,224,164,.45)}
.evo-art.is-ai .evo-msg .ic{background:rgba(65,224,164,.15);color:var(--ok)}
.evo-txt .kicker{margin-bottom:16px}
.evo-h{font-size:clamp(2rem,4vw,3rem);line-height:1.04}
.evo-h span{display:block;opacity:.25;transition:opacity .6s,transform .6s var(--ease);transform:translateX(-10px)}
.evo-h span.on{opacity:1;transform:none}
.evo-txt p{margin-top:22px;color:var(--muted);font-size:.92rem;max-width:40ch}
.evo-txt p b{color:var(--paper)}
.evo-txt hr{border:0;height:2px;width:120px;background:linear-gradient(90deg,var(--accent),transparent);margin:26px 0}
.evo-txt .strong{font-family:var(--ff-d);font-weight:700;font-size:1.15rem;letter-spacing:-.03em;line-height:1.25}
.evo-link{display:inline-flex;align-items:center;gap:12px;min-height:44px;margin-top:26px;font-weight:700;font-size:.86rem}
.evo-link i{width:30px;height:30px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center;font-style:normal}
@keyframes bounceY{50%{transform:translateY(4px)}}
@media (max-width:900px){.evo{grid-template-columns:1fr;gap:36px}.evo-art{max-width:420px}}

/* ---------- PUB (sección clara) ---------- */
.pub{background:radial-gradient(60% 70% at 100% 0%,#f3ecfd 0%,rgba(243,236,253,0) 70%),radial-gradient(55% 60% at 0% 100%,#cdb9ec 0%,rgba(205,185,236,0) 70%),linear-gradient(#e7ddf6,#d9caef);color:#1b0f33}
.pub .kicker{color:#5b21c4}
.pub .kicker .dot{background:#5b21c4}
.pub-head{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:end;margin-bottom:46px}
.pub-head h2 .hl{color:#5b21c4}
.pub-head p{color:#4b3d66;font-size:.95rem}
.pub-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pcard .ill{position:relative;height:210px;border-radius:20px;background:linear-gradient(180deg,#1c1233,#120b22);overflow:hidden;box-shadow:0 20px 50px -20px rgba(40,10,90,.55);margin-bottom:18px}
.pcard .meta{display:flex;align-items:center;gap:10px;font-size:.66rem;font-weight:800;letter-spacing:.1em;color:#5b21c4}
.pcard .meta b{padding:3px 8px;border-radius:6px;background:#1b0f33;color:#fff}
.pcard h3{font-size:1.35rem;margin:12px 0 8px;letter-spacing:-.04em}
.pcard p{color:#4b3d66;font-size:.9rem}
/* ilus 1: versiones de anuncio */
.ill-ads{display:flex;align-items:center;justify-content:center;gap:16px;padding:20px}
.ill-ads .main{width:96px;height:150px;border-radius:12px;background:linear-gradient(160deg,#9759ff,#4a1aa8);position:relative;padding:10px;animation:pubASag 4s ease-in-out infinite;transform-origin:bottom}
.ill-ads .main i{display:block;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.3);margin:16px auto 10px}
.ill-ads .main b{display:block;height:6px;border-radius:3px;background:rgba(255,255,255,.35);margin:5px 6px}
.ill-ads .main .tired{position:absolute;top:-10px;right:-10px;width:26px;height:26px;border-radius:50%;background:var(--warn);display:grid;place-items:center;font-size:.7rem;font-weight:800;color:#1b0f33;animation:pulse 1.6s infinite}
@keyframes pubASag{0%,100%{transform:none;filter:none}50%{transform:scaleY(.94) rotate(-2deg);filter:saturate(.4) brightness(.8)}}
.ill-ads .vers{display:grid;gap:8px}
.ill-ads .v{display:flex;align-items:center;gap:8px;width:120px;padding:8px 10px;border-radius:10px;border:1px dashed rgba(255,255,255,.25);font-size:.62rem;color:#cbbbe9;font-weight:700}
.ill-ads .v i{width:16px;height:16px;border-radius:5px;border:1px dashed rgba(255,255,255,.35);display:grid;place-items:center;font-style:normal}
.ill-ads .v em{margin-left:auto;width:16px;height:3px;border-radius:2px;background:var(--warn);font-style:normal;animation:blink2 1.4s infinite}
.ill-ads .v:nth-child(2) em{animation-delay:.3s}.ill-ads .v:nth-child(3) em{animation-delay:.6s}
@keyframes blink2{50%{opacity:.2}}
/* ilus 2: carpeta */
.ill-folder{padding:16px}
.ill-folder .fh{display:flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;color:#fff;margin-bottom:10px}
.ill-folder .fh svg{width:16px;height:16px;color:var(--hl)}
.ill-folder .fh span{margin-left:auto;padding:3px 8px;border-radius:6px;background:rgba(255,181,71,.18);color:var(--warn);font-size:.6rem}
.ill-folder .files{height:140px;overflow:hidden;mask-image:linear-gradient(180deg,#000 70%,transparent);-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent)}
.ill-folder .list{animation:files 8s linear infinite}
.ill-folder .f{display:flex;align-items:center;gap:10px;padding:8px 10px;margin-bottom:6px;border-radius:8px;background:rgba(255,255,255,.04);font-size:.66rem;color:#d8ccef}
.ill-folder .f i{width:16px;height:16px;border-radius:4px;background:rgba(255,255,255,.1);display:grid;place-items:center;font-style:normal;font-size:.5rem}
.ill-folder .f em{margin-left:auto;width:12px;height:12px;border-radius:50%;border:2px solid var(--warn);font-style:normal}
@keyframes files{from{transform:translateY(-50%)}to{transform:translateY(0)}}
/* ilus 3: muro de texto */
.ill-wall{display:flex;align-items:center;justify-content:center;gap:22px}
.ill-wall .ph{width:100px;height:168px;border-radius:16px;border:2px solid rgba(255,255,255,.18);padding:12px 9px;overflow:hidden;position:relative}
.ill-wall .ph b{display:block;height:4px;border-radius:2px;background:rgba(255,255,255,.22);margin-bottom:5px}
.ill-wall .ph b:nth-child(3n){width:70%}
.ill-wall .ph .scroll{animation:wall 5s linear infinite}
@keyframes wall{to{transform:translateY(-50%)}}
.ill-wall .eye{display:grid;justify-items:center;gap:8px;font-size:.6rem;color:#cbbbe9;font-weight:700}
.ill-wall .eye svg{width:34px;height:34px;color:var(--warn);animation:pubNEye 3s ease-in-out infinite}
.ill-wall .eye .lvl{width:10px;height:70px;border-radius:6px;background:rgba(255,255,255,.08);position:relative;overflow:hidden}
.ill-wall .eye .lvl i{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(0deg,#ff5470,var(--warn));animation:lvl 3s ease-in-out infinite}
@keyframes pubNEye{0%,40%,100%{transform:scaleY(1)}45%{transform:scaleY(.1)}}
@keyframes lvl{0%{height:90%}100%{height:8%}}
.pub-band{margin-top:40px;display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;padding:34px 36px;border-radius:24px;background:linear-gradient(120deg,#1b1033,#120a22);color:var(--paper);box-shadow:0 30px 60px -30px rgba(40,10,90,.7)}
.pub-band h3{font-size:clamp(1.3rem,2.4vw,1.7rem);letter-spacing:-.04em}
.pub-band p{color:var(--muted);font-size:.9rem;margin-top:10px;max-width:56ch}
@media (max-width:900px){.pub-head{grid-template-columns:1fr}.pub-cards{grid-template-columns:1fr}.pub-band{padding:28px 22px}}

/* ---------- CURSO / SERVICIOS carrusel ---------- */
.cur-head{display:grid;justify-items:center;gap:16px;text-align:center;margin-bottom:44px}
.cur-head p{color:var(--muted);font-size:.92rem}
.cur-head p b{color:var(--paper)}
.cur-rail{position:relative;overflow:hidden;padding:40px 0 64px;cursor:grab;touch-action:pan-y;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.cur-rail.dragging{cursor:grabbing}
.cur-rail.dragging .ccard{transition:none}
.cur-track{display:flex;gap:clamp(14px,1.5vw,22px);width:max-content;will-change:transform}
.ccard{position:relative;flex:none;width:clamp(214px,18.2vw,262px);aspect-ratio:2/3;border-radius:18px;overflow:hidden;isolation:isolate;background:#140c24;user-select:none;-webkit-user-select:none;
  box-shadow:0 22px 50px rgba(3,1,10,.6),0 0 0 1px rgba(199,167,255,.14);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}
.ccard::after{content:"";position:absolute;inset:0;z-index:6;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.17) 48%,transparent 60%) no-repeat;background-size:260% 100%;background-position:120% 0;}
@keyframes sheen{0%,72%{background-position:120% 0}100%{background-position:-40% 0}}
.ccard.feat{box-shadow:0 22px 60px rgba(3,1,10,.6),0 0 0 1.5px #e2d2ff,0 0 44px rgba(151,89,255,.5),0 0 90px rgba(151,89,255,.18)}
.ccard.feat::before{content:"";position:absolute;inset:0;z-index:7;border-radius:inherit;pointer-events:none;padding:1.5px;background:linear-gradient(160deg,#fff,#c7a7ff 30%,transparent 55%,#9759ff 85%,#e8d9ff);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
@media (hover:hover) and (pointer:fine){
  .ccard:hover{transform:translateY(-10px) scale(1.035);box-shadow:0 34px 70px rgba(3,1,10,.8),0 0 0 1px rgba(199,167,255,.5),0 0 50px rgba(151,89,255,.3)}
  .ccard:hover::after{animation:none;background-position:-40% 0;transition:background-position .9s cubic-bezier(.2,.8,.2,1)}
}
.cc-scene{position:absolute;inset:0;background:radial-gradient(circle at 50% 26%,var(--g1),#140c24 72%);overflow:hidden}
.cc-scene .blob{position:absolute;border-radius:50%;filter:blur(32px);opacity:.75}
.cc-scene .blob.a{width:150px;height:150px;background:var(--g1);top:2%;left:-18%}
.cc-scene .blob.b{width:130px;height:130px;background:var(--g2);top:26%;right:-20%;animation-delay:-4s}
@keyframes blob{to{transform:translate(34px,24px) scale(1.18)}}
.cc-scene .grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(180deg,#000 30%,transparent 65%);-webkit-mask-image:linear-gradient(180deg,#000 30%,transparent 65%)}
.cc-scene .photo{position:absolute;left:0;top:0;width:100%;height:78%;object-fit:cover;object-position:var(--pos,center);pointer-events:none}
.glass{position:absolute;left:50%;top:31%;width:72%;padding:13px;border-radius:16px;transform:translate(-50%,-50%) rotate(-4deg);
  background:linear-gradient(140deg,rgba(255,255,255,.24),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 24px 44px -12px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.45);background-color:rgba(12,7,26,.5)}
@media (hover:hover) and (pointer:fine){.ccard:hover .glass{animation:glassFloat 6s ease-in-out infinite}.ccard:hover .glass.low{animation-name:glassFloat2}}
.glass::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(160deg,rgba(255,255,255,.32),transparent 42%);pointer-events:none}
.glass.low{top:auto;bottom:42%;width:66%;transform:translate(-50%,0) rotate(3deg)}
@keyframes glassFloat{50%{transform:translate(-50%,-57%) rotate(1.5deg)}}
@keyframes glassFloat2{50%{transform:translate(-50%,-8px) rotate(-1deg)}}
.glass .gh{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:.6rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.glass .gh i{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.2);flex:none}
.glass .gh svg{width:14px;height:14px;color:#fff}
.g-bars{display:flex;align-items:flex-end;gap:5px;height:54px}
.g-bars b{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(0deg,rgba(255,255,255,.35),#fff);transform-origin:bottom;animation:gBar 2.6s ease-in-out infinite;animation-delay:calc(var(--i)*.12s)}
@keyframes gBar{50%{transform:scaleY(.6)}}
.g-fun{display:grid;gap:5px;justify-items:center}
.g-fun b{height:15px;border-radius:4px;font-size:.5rem;display:grid;place-items:center;letter-spacing:.08em;animation:pulseO 3s ease-in-out infinite;animation-delay:calc(var(--i)*.5s)}
.g-fun b:nth-child(1){width:100%;background:rgba(151,89,255,.9)}.g-fun b:nth-child(2){width:74%;background:rgba(209,79,224,.9)}.g-fun b:nth-child(3){width:48%;background:rgba(47,207,148,.95)}
@keyframes pulseO{50%{opacity:.55}}
.g-track{position:relative;display:grid;gap:5px}
.g-track b{height:10px;border-radius:3px}
.g-track b:nth-child(1){width:90%;background:rgba(189,138,255,.9)}.g-track b:nth-child(2){width:70%;margin-left:12%;background:rgba(65,224,164,.85)}.g-track b:nth-child(3){width:80%;background:rgba(255,181,71,.85)}
.g-track i{position:absolute;top:-4px;bottom:-4px;width:2px;background:#fff;box-shadow:0 0 8px #fff;animation:gHead 3s linear infinite}
@keyframes gHead{from{left:0}to{left:100%}}
.g-chat{display:grid;gap:5px}
.g-chat b{max-width:88%;padding:5px 8px;border-radius:8px;font-size:.55rem;font-weight:600;line-height:1.3;opacity:0;animation:word 6s var(--ease) infinite;animation-delay:calc(var(--i)*.7s)}
.g-chat b.in{background:rgba(255,255,255,.24);justify-self:start}
.g-chat b.out{background:rgba(65,224,164,.9);color:#06281a;justify-self:end}
.g-rings{position:relative;height:60px;display:grid;place-items:center}
.g-rings b{position:absolute;border-radius:50%;border:2px solid rgba(255,255,255,.6)}
.g-rings b:nth-child(1){width:56px;height:56px}.g-rings b:nth-child(2){width:36px;height:36px}.g-rings b:nth-child(3){width:14px;height:14px;background:#fff;box-shadow:0 0 14px #fff}
.g-rings i{position:absolute;left:50%;top:50%;width:26px;height:2px;background:#fff;transform-origin:right center;animation:arrow 2.4s var(--ease) infinite}
@keyframes arrow{0%{transform:translate(-80px,-30px) rotate(-30deg);opacity:0}40%,100%{transform:translate(-26px,-8px) rotate(-30deg);opacity:1}}
.g-wave{display:flex;align-items:center;gap:3px;height:40px}
.g-wave b{flex:1;border-radius:3px;background:#fff;height:30%;animation:wave 1.2s ease-in-out infinite;animation-delay:calc(var(--i)*-.13s)}
@keyframes wave{50%{height:100%}}
.g-line svg{width:100%;height:50px}
.g-line path{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-dasharray:220;stroke-dashoffset:220;animation:gDraw 4s var(--ease) infinite}
@keyframes gDraw{0%{stroke-dashoffset:220}50%,90%{stroke-dashoffset:0}100%{stroke-dashoffset:-220}}
.g-loop{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:.5rem;font-weight:800;letter-spacing:.06em}
.g-loop span{display:grid;justify-items:center;gap:4px}
.g-loop span i{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.22)}
.g-loop span i svg{width:14px;height:14px}
.g-loop em{flex:1;height:2px;margin-bottom:12px;background:repeating-linear-gradient(90deg,#fff 0 4px,transparent 4px 8px);background-size:8px 2px;animation:dashMove .6s linear infinite}
@keyframes dashMove{to{background-position:8px 0}}
.g-rec{display:flex;align-items:center;gap:6px;font-size:.6rem;font-weight:800}
.g-rec b{width:8px;height:8px;border-radius:50%;background:#ff3d5a;box-shadow:0 0 10px #ff3d5a;animation:pulse 1s infinite}
.cc-body{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:44px 16px 18px;background:linear-gradient(180deg,transparent,rgba(14,8,32,.9) 34%,#0e0820)}
.cc-body .lbl{display:flex;align-items:center;gap:6px;font-size:.56rem;font-weight:800;letter-spacing:.14em;color:#d9c9f7}
.cc-body .lbl .logo-bg{width:16px;height:16px;border-radius:4px}
.cc-body .lbl::after{content:"";width:18px;height:1px;background:rgba(255,255,255,.35)}
.cc-body .num{font-family:var(--ff-d);font-weight:800;font-size:2.7rem;line-height:1;color:transparent;-webkit-text-stroke:1.3px var(--hl);margin:6px 0 2px;letter-spacing:-.02em}
.cc-body h3{font-size:1.1rem;line-height:1.05;letter-spacing:-.035em}
.cc-body p{font-size:.72rem;color:var(--muted);margin-top:6px;line-height:1.4}
.ccard .star{position:absolute;top:12px;right:12px;z-index:5;padding:4px 8px;border-radius:6px;background:var(--ok);color:#06281a;font-size:.56rem;font-weight:800;letter-spacing:.06em}
.cur-pause{display:grid;place-items:center;width:46px;height:46px;margin:-30px auto 0;border-radius:50%;border:1px solid var(--line-2);background:rgba(255,255,255,.03);position:relative;transition:background .2s}
.cur-pause:hover{background:rgba(151,89,255,.18)}
.cur-pause svg{width:16px;height:16px}
@media (max-width:760px){.ccard{width:min(58vw,236px)}}

/* ---------- BONOS ---------- */
.bon-head{margin-bottom:56px}
.bon-head h2{margin-top:14px}
.bon-head p{margin-top:14px;color:var(--muted)}
.bon-block{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;margin-bottom:100px}
.bon-block:last-child{margin-bottom:0}
.bon-txt .chip svg{width:12px;height:12px}
.bon-txt h3{font-size:clamp(1.6rem,3vw,2.2rem);margin:18px 0 8px;letter-spacing:-.045em}
.bon-txt .tag{font-family:var(--ff-d);font-weight:700;font-size:1.05rem;letter-spacing:-.02em}
.bon-txt p{color:var(--muted);font-size:.92rem;margin-top:16px;max-width:46ch}
.feats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}
.feat{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.02);font-size:.8rem;font-weight:600}
.feat svg{width:16px;height:16px;color:var(--hl);flex:none}
/* panel de reportes */
.rep{border-radius:20px;border:1px solid var(--line-2);background:linear-gradient(180deg,#160e2b,#0f0a1e);overflow:hidden;box-shadow:0 40px 90px -40px rgba(151,89,255,.6)}
.rep-bar{display:flex;align-items:center;gap:6px;padding:12px 16px;border-bottom:1px solid var(--line);font-size:.72rem;color:var(--muted)}
.rep-bar i{width:8px;height:8px;border-radius:50%;background:var(--line-2)}
.rep-bar i:first-child{background:var(--accent)}
.rep-bar span{margin-left:8px}
.rep-body{display:grid;grid-template-columns:150px 1fr}
.rep-side{border-right:1px solid var(--line);padding:12px;display:grid;gap:6px;align-content:start}
.rep-side button{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:10px;font-size:.74rem;text-align:left;color:var(--muted);transition:.2s}
.rep-side button b{font-family:var(--ff-d);font-size:.8rem;color:var(--paper);opacity:.5}
.rep-side button.on{background:rgba(151,89,255,.16);color:var(--paper)}
.rep-side button.on b{opacity:1;color:var(--hl)}
.rep-main{padding:18px}
.rep-main .tags{display:flex;gap:6px}
.rep-main .tags span{padding:4px 8px;border-radius:6px;background:rgba(255,255,255,.06);font-size:.58rem;font-weight:800;letter-spacing:.08em}
.rep-main h4{font-size:1.1rem;margin:12px 0 8px;letter-spacing:-.03em}
.rep-main p{font-size:.78rem;color:var(--muted)}
.rep-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0}
.rep-kpis div{padding:10px;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.rep-kpis small{display:block;font-size:.56rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.rep-kpis b{font-family:var(--ff-d);font-size:1.05rem}
.rep-kpis em{display:block;font-style:normal;font-size:.6rem;color:var(--ok);font-weight:700}
.rep-chart{height:80px;border-radius:10px;background:rgba(255,255,255,.02);border:1px solid var(--line);padding:6px}
.rep-chart svg{width:100%;height:100%}
.rep-chart .ln{fill:none;stroke:var(--hl);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:400;stroke-dashoffset:400;animation:draw 2s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.rep-copy{display:flex;align-items:center;justify-content:space-between;margin-top:12px;padding:10px 12px;border-radius:10px;background:rgba(151,89,255,.12);font-size:.72rem;font-weight:700}

/* agente IA con skills */
.skills{display:grid;grid-template-columns:1fr 230px;gap:18px;align-items:start}
.sk-panel{border-radius:20px;border:1px solid var(--line-2);background:linear-gradient(180deg,#160e2b,#0f0a1e);padding:16px}
.sk-top{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.04);margin-bottom:12px}
.sk-top b{font-size:.86rem}
.sk-top span{font-size:.78rem;color:var(--muted)}
.sk-top .cnt{margin-left:auto;padding:4px 8px;border-radius:6px;border:1px solid var(--line-2);font-size:.66rem;font-weight:800;font-variant-numeric:tabular-nums}
.sk-req{padding:12px;border-radius:12px;border:1px solid var(--line);margin-bottom:12px}
.sk-req small{font-size:.56rem;font-weight:800;letter-spacing:.1em;color:var(--hl)}
.sk-req p{font-weight:700;font-size:.86rem;margin:4px 0 10px}
.sk-req .ans{min-height:58px;border-radius:10px;border:1px dashed var(--line-2);display:grid;place-items:center;font-size:.74rem;color:var(--muted);padding:10px;text-align:center;transition:.4s}
.sk-req .ans.good{border-style:solid;border-color:rgba(65,224,164,.4);color:#c9f7e4;background:rgba(65,224,164,.06);text-align:left;place-items:start}
.sk-rows{display:grid;gap:6px}
.sk-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;border:1px solid var(--line);font-size:.78rem;color:var(--muted);transition:.4s}
.sk-row i{width:22px;height:22px;border-radius:6px;background:rgba(255,255,255,.06);display:grid;place-items:center;flex:none}
.sk-row i svg{width:12px;height:12px}
.sk-row small{margin-left:auto;font-size:.66rem;opacity:0;transition:.4s}
.sk-row.on{border-color:rgba(189,138,255,.45);background:rgba(151,89,255,.12);color:var(--paper)}
.sk-row.on i{background:var(--accent)}
.sk-row.on small{opacity:1;color:var(--hl)}
.sk-phone{border-radius:22px;border:1px solid var(--line-2);padding:6px;background:#0f0a1e;position:sticky;top:20px}
.sk-phone .scr{border-radius:17px;aspect-ratio:9/17;overflow:hidden;background:#0b141a;display:flex;flex-direction:column;position:relative}
.sk-phone .wa-win{margin-top:0;border-radius:0;border:0;box-shadow:none}
.sk-phone .wa-hd .icons svg{width:13px;height:13px}
.sk-phone .tagl{margin-left:auto;padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.1);font-size:.5rem;font-weight:800;letter-spacing:.08em;white-space:nowrap;transition:background .3s}
.sk-phone.on .tagl{background:var(--accent)}
@media (max-width:900px){.bon-block{grid-template-columns:1fr;gap:34px}.feats{grid-template-columns:1fr}.rep-body{grid-template-columns:1fr}.rep-side{grid-auto-flow:column;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line)}.skills{grid-template-columns:1fr}.sk-phone{width:100%;max-width:280px;position:static}}

/* ---------- FUNDADOR ---------- */
.inst{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center}
.inst-img{position:relative;aspect-ratio:1/1;border-radius:28px;overflow:hidden;border:1px solid var(--line-2);background:radial-gradient(circle at 60% 30%,#3a1b72,#120a22 70%)}
.inst-img .person{position:absolute;left:50%;bottom:-6px;width:80%;transform:translateX(-50%);color:#2a1650}
.inst-img .sparks{position:absolute;inset:0;background-image:radial-gradient(2px 2px at 20% 30%,#ffb547,transparent),radial-gradient(2px 2px at 70% 20%,#ffb547,transparent),radial-gradient(1.5px 1.5px at 80% 60%,#bd8aff,transparent),radial-gradient(2px 2px at 30% 70%,#bd8aff,transparent),radial-gradient(1.5px 1.5px at 55% 45%,#ffb547,transparent)}
.inst-img .ph-note{position:absolute;left:16px;bottom:16px;padding:6px 10px;border-radius:8px;background:rgba(0,0,0,.5);font-size:.66rem;color:var(--muted)}
.inst h2{font-size:clamp(2.2rem,4.4vw,3.2rem);margin:14px 0 6px}
.inst .role{color:var(--hl);font-size:.88rem;font-weight:600}
.partner{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:10px}
.partner li{display:flex;gap:12px;align-items:flex-start;font-size:.9rem;font-weight:600}
.inst p.t{margin-top:18px;color:var(--muted);font-size:.92rem;max-width:56ch}
@media (max-width:900px){.inst{grid-template-columns:1fr;gap:30px}.inst-img{max-width:360px}}

/* ---------- OFERTA ---------- */
.ofr{position:relative;max-width:820px;margin-inline:auto;border-radius:32px;padding:56px 44px 0;text-align:center;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,#24124a,#140b2a 45%,#0f0a1e);border:1px solid rgba(189,138,255,.3);box-shadow:0 0 0 1px rgba(255,255,255,.03),0 50px 120px -40px rgba(151,89,255,.6)}
.ofr::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:conic-gradient(from var(--ang),transparent 0 70%,var(--hl) 82%,#ff4fd8 88%,transparent 95%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;--ang:200deg}
@keyframes ofrSpin{to{--ang:360deg}}
.ofr .glow{position:absolute;top:-200px;left:50%;width:600px;height:400px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(151,89,255,.45),transparent);z-index:-1}
.ofr-logo{display:flex;align-items:center;justify-content:center;gap:16px;margin:22px 0 14px}
.ofr-logo .logo-mark{width:70px;height:70px;border-radius:18px}
.ofr-logo .logo-mark svg{width:38px;height:38px}
.ofr-logo .logo-txt{font-size:2.6rem}
.ofr-logo .logo-txt small{font-size:.9rem}
.ofr > p.d{color:var(--muted);font-size:.92rem;max-width:56ch;margin-inline:auto}
.ofr .recv{margin:34px 0 16px;font-size:.66rem;font-weight:800;letter-spacing:.14em;color:var(--muted)}
.ofr .first{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border-radius:12px;border:1px solid rgba(189,138,255,.4);background:rgba(151,89,255,.14);font-weight:700;font-size:.86rem}
.ck{width:20px;height:20px;border-radius:50%;flex:none;display:grid;place-items:center;background:radial-gradient(circle at 30% 30%,#c9a6ff,#7c3df0);box-shadow:0 0 12px -2px var(--accent)}
.ck svg{width:11px;height:11px}
.ofr-list{display:grid;grid-template-columns:1fr 1fr;gap:14px 30px;text-align:left;margin:24px auto 0;max-width:620px}
.ofr-list li{display:flex;gap:12px;align-items:flex-start;font-size:.86rem;list-style:none}
.ofr-list{padding:0}
.price{position:relative;margin:50px 0 6px;display:flex;align-items:flex-start;justify-content:center;gap:10px}
.price .from{position:absolute;top:-24px;left:0;right:0;font-size:.82rem;color:var(--muted)}
.price .from s{opacity:.8}
.price .cur{font-family:var(--ff-d);font-weight:700;font-size:1.8rem;color:var(--hl);margin-top:22px}
.price .val{font-family:var(--ff-d);font-weight:800;font-size:clamp(5.5rem,14vw,8.5rem);line-height:.9;letter-spacing:-.06em;color:#f5f0ff;position:relative}
.price .ring{position:absolute;left:50%;top:50%;width:300px;height:110px;margin:-55px 0 0 -150px;border-radius:50%;border:1px solid rgba(189,138,255,.4);transform:rotate(-8deg);pointer-events:none}
.price .ring::after{content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:var(--hl);box-shadow:0 0 14px var(--hl);offset-path:ellipse(150px 55px at 150px 55px);animation:ofrOrbit 5s linear infinite}
@keyframes ofrOrbit{from{offset-distance:0%}to{offset-distance:100%}}
.ofr .pay{font-size:.82rem;color:var(--muted)}
.ofr .pay b{color:var(--paper)}
.ofr .cta-wrap{margin:28px 0 14px}
.ofr .small{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;font-size:.74rem;color:var(--muted)}
.ofr .small svg{width:14px;height:14px;display:inline;vertical-align:-2px;margin-right:4px}
.g-strip{margin:40px -44px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0;overflow:hidden;background:rgba(151,89,255,.08)}
.g-strip .mq-track{animation:none;width:100%;justify-content:center}
.g-strip .mq-track span+span{display:none}
.g-strip span{font-size:.7rem!important;letter-spacing:.14em;text-transform:uppercase;font-family:var(--ff-b)!important;font-weight:800!important;color:var(--hl)!important}
.guar{display:flex;align-items:center;gap:30px;padding:36px 10px 44px;text-align:left}
.seal{position:relative;width:132px;height:132px;flex:none}
.seal svg.txt{position:absolute;inset:0}
.seal .core{position:absolute;inset:18px;border-radius:50%;display:grid;place-items:center;align-content:center;background:radial-gradient(circle at 30% 30%,#7436e0,#4c1aa8);box-shadow:0 0 40px -6px var(--accent),inset 0 2px 0 rgba(255,255,255,.3);font-family:var(--ff-d);font-weight:800;line-height:.9}
.seal .core b{font-size:2.4rem}
.seal .core small{font-size:.62rem;letter-spacing:.1em}
.guar h3{font-size:1.3rem;letter-spacing:-.03em}
.guar p{color:var(--muted);font-size:.88rem;margin-top:8px;max-width:40ch}
@media (max-width:700px){.ofr{padding:40px 20px 0}.g-strip{margin:34px -20px 0}.ofr-list{grid-template-columns:1fr}.ofr-logo .logo-txt{font-size:1.9rem}.guar{flex-direction:column;text-align:center}}

/* ---------- FAQ ---------- */
.faq-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px}
.faq-wrap h2{font-size:clamp(2.2rem,4.4vw,3.2rem);margin-top:14px}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list details:first-child{border-top:1px solid var(--line)}
.faq-list summary{list-style:none;cursor:pointer;padding:20px 4px;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:.92rem;font-weight:600}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";font-size:1.3rem;color:var(--hl);transition:transform .3s;flex:none}
.faq-list details[open] summary::after{transform:rotate(45deg)}
.faq-list details p{padding:0 4px 20px;color:var(--muted);font-size:.9rem}
@media (max-width:900px){.faq-wrap{grid-template-columns:1fr;gap:20px}}

/* ---------- CIERRE + FOOTER ---------- */
.closing{position:relative;text-align:center;padding:110px 0 90px;overflow:hidden}
.closing::before{content:"";position:absolute;left:50%;top:60%;width:700px;height:400px;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(151,89,255,.3),transparent);z-index:-1}
.closing small{color:var(--muted);font-size:.84rem}
.closing h2{font-size:clamp(2rem,4.6vw,3.4rem);margin:18px 0 34px}
.footer{border-top:1px solid var(--line);padding:30px 0 40px}
.footer .row{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.footer .copy{font-size:.76rem;color:var(--muted)}
.footer .legal{margin-top:20px;font-size:.74rem;color:var(--muted);max-width:90ch}
.footer .legal b{color:var(--paper)}

/* WhatsApp flotante */
.wa{position:fixed;right:18px;bottom:18px;z-index:60;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#25d366;color:#fff;box-shadow:0 10px 30px -6px rgba(37,211,102,.6)}
.wa::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #25d366;animation:waRing 2.4s ease-out infinite}
@keyframes waRing{from{transform:scale(1);opacity:.9}to{transform:scale(1.6);opacity:0}}
.wa svg{width:28px;height:28px}

/* =========================================================
   GROWTH: piezas propias de la agencia
   ========================================================= */
.pillars{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.pillar{display:inline-flex;align-items:center;gap:8px;padding:9px 13px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.03);font-size:.78rem;font-weight:700}
.pillar i{width:8px;height:8px;border-radius:3px;transform:rotate(45deg);background:var(--c,var(--accent));box-shadow:0 0 10px var(--c,var(--accent))}

/* fotos y logo reales */
.ofr-logo .logo-img{width:120px;height:120px;border-radius:26px;box-shadow:0 0 60px -10px var(--accent),0 0 0 1px rgba(255,255,255,.12)}
.inst-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.inst-img img{object-position:72% 18%}
.inst-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(11,7,22,.6))}

/* --- ilustraciones nuevas (sección clara) --- */
.ill-likes{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:20px 22px;gap:10px}
.ill-likes .side{display:grid;justify-items:center;gap:6px;text-align:center}
.ill-likes .side small{font-size:.58rem;font-weight:800;letter-spacing:.1em;color:#cbbbe9}
.ill-likes .side b{font-family:var(--ff-d);font-size:1.6rem;color:#fff;line-height:1}
.ill-likes .side.bad b{color:#ff5470}
.ill-likes .heart{width:42px;height:42px;color:#ff3d7f;animation:hb 1.3s ease-in-out infinite}
@keyframes hb{50%{transform:scale(1.15)}}
.ill-likes .cart{width:38px;height:38px;color:#8f84a8}
.ill-likes .neq{font-family:var(--ff-d);font-weight:800;font-size:2rem;color:var(--warn)}
.ill-likes .fly{position:absolute;left:22%;bottom:30px;width:14px;height:14px;color:#ff3d7f;opacity:0;animation:flyUp 3s ease-out infinite}
.ill-likes .fly:nth-of-type(2){left:28%;animation-delay:.7s}.ill-likes .fly:nth-of-type(3){left:16%;animation-delay:1.4s}.ill-likes .fly:nth-of-type(4){left:24%;animation-delay:2.1s}
@keyframes flyUp{0%{opacity:0;transform:translateY(0) scale(.6)}15%{opacity:1}100%{opacity:0;transform:translateY(-150px) translateX(16px) scale(1.1)}}
.ill-likes .flat{grid-column:1/-1;height:34px;position:relative}
.ill-likes .flat svg{width:100%;height:100%}
.ill-chats{padding:14px 16px;display:grid;gap:7px;align-content:start}
.ill-chats .c{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.05);font-size:.66rem;color:#e6dcf7;animation:chatIn 6s ease-in-out infinite;animation-delay:calc(var(--i)*.4s)}
.ill-chats .c i{width:24px;height:24px;border-radius:50%;flex:none;background:linear-gradient(135deg,#6b2bd9,#a3248c);font-style:normal;display:grid;place-items:center;font-size:.55rem;font-weight:800}
.ill-chats .c b{display:block;font-size:.66rem}
.ill-chats .c em{margin-left:auto;font-style:normal;padding:3px 7px;border-radius:6px;background:rgba(255,84,112,.16);color:#ff8095;font-size:.56rem;font-weight:800;white-space:nowrap}
@keyframes chatIn{0%{opacity:0;transform:translateX(-12px)}8%,90%{opacity:1;transform:none}100%{opacity:0}}

/* --- EMBUDO DE CONTENIDO TOFU / MOFU / BOFU --- */
.fun-wrap{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.funnel{position:relative;height:440px;display:grid;grid-template-rows:repeat(3,1fr) 70px;gap:8px}
.fl{position:relative;display:grid;place-items:center;text-align:center;cursor:pointer;transition:filter .4s,transform .4s var(--ease);border:0;color:#fff;font:inherit;padding:0}
.fl .shape{position:absolute;inset:0;background:linear-gradient(180deg,var(--c1),var(--c2));opacity:.35;transition:opacity .4s}
.fl:nth-child(1) .shape{clip-path:polygon(0 0,100% 0,88% 100%,12% 100%)}
.fl:nth-child(2) .shape{clip-path:polygon(12% 0,88% 0,76% 100%,24% 100%)}
.fl:nth-child(3) .shape{clip-path:polygon(24% 0,76% 0,64% 100%,36% 100%)}
.fl .inner{position:relative;z-index:2;display:grid;gap:2px}
.fl .inner small{font-size:.62rem;font-weight:800;letter-spacing:.14em;opacity:.85}
.fl .inner b{font-family:var(--ff-d);font-size:clamp(1.1rem,2.2vw,1.45rem);letter-spacing:-.03em}
.fl.on .shape{opacity:1}
.fl.on{filter:drop-shadow(0 0 26px var(--c1))}
.fl:hover .shape{opacity:.75}
.fl.t1{--c1:#9759ff;--c2:#6a2fd0}
.fl.t2{--c1:#d14fe0;--c2:#8a2fb8}
.fl.t3{--c1:#2fcf94;--c2:#13865e}
.spout{position:relative;display:grid;place-items:center}
.spout::before{content:"";position:absolute;top:0;left:38%;right:38%;height:46px;background:linear-gradient(180deg,rgba(65,224,164,.35),transparent);clip-path:polygon(0 0,100% 0,80% 100%,20% 100%)}
.spout .sales{position:relative;margin-top:30px;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(65,224,164,.14);border:1px solid rgba(65,224,164,.45);color:#c9f7e4;font-size:.78rem;font-weight:800}
.spout .sales b{font-family:var(--ff-d);color:var(--ok)}
.funnel .drops{position:absolute;inset:-46px 0 70px;pointer-events:none;z-index:3}
.drop{position:absolute;top:0;width:15px;height:17px;margin-left:-7.5px;color:#d9c2ff}
.drop svg{width:100%;height:100%;filter:drop-shadow(0 0 5px currentColor)}
.spout .sales.bump{animation:salesBump .5s var(--ease)}
@keyframes salesBump{40%{transform:scale(1.08);box-shadow:0 0 24px -2px var(--ok)}}
.spout .sales .cnt{font-family:var(--ff-d);color:var(--ok);font-variant-numeric:tabular-nums;min-width:2ch;text-align:right}
.fun-panel{border-radius:24px;border:1px solid var(--line-2);background:linear-gradient(180deg,#160e2b,#0f0a1e);padding:28px;min-height:400px;display:flex;flex-direction:column}
.fun-tabs{display:flex;gap:6px;margin-bottom:22px;flex-wrap:wrap}
.fun-tabs button{min-height:44px;padding:8px 16px;border-radius:999px;border:1px solid var(--line-2);font-size:.72rem;font-weight:800;letter-spacing:.06em;color:var(--muted);transition:.3s}
.fun-tabs button.on{color:#fff;background:var(--tc);border-color:transparent;box-shadow:0 0 22px -6px var(--tc)}
.fun-acr{display:flex;gap:8px;flex-wrap:wrap}
.fun-acr span{padding:5px 10px;border-radius:8px;font-size:.66rem;font-weight:800;letter-spacing:.08em;background:rgba(255,255,255,.06)}
.fun-acr span:first-child{background:var(--tc);color:#fff}
.fun-panel h3{font-size:clamp(1.8rem,3.4vw,2.5rem);margin:16px 0 4px;letter-spacing:-.045em}
.fun-panel .goal{font-family:var(--ff-d);font-weight:700;font-size:1.05rem;color:var(--tcl);letter-spacing:-.02em}
.fun-panel p.d{color:var(--muted);font-size:.9rem;margin-top:14px}
.fun-types{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.fun-types span{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:9px;border:1px solid var(--line);font-size:.76rem;font-weight:600;background:rgba(255,255,255,.03)}
.fun-types span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--tc)}
.fun-kpi{margin-top:auto;padding-top:20px;display:flex;align-items:center;gap:12px;font-size:.82rem;color:var(--muted)}
.fun-kpi b{color:var(--paper)}
.fun-kpi i{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.06);flex:none}
.fun-kpi svg{width:16px;height:16px;color:var(--tcl)}
.fun-panel .swap{transition:opacity .3s}
.fun-panel.fade .swap{opacity:0}
.mini-cta{display:inline-flex;align-items:center;gap:10px;margin-top:28px;font-weight:700;font-size:.88rem;color:var(--hl)}
.mini-cta span{transition:transform .25s var(--ease)}
.mini-cta:hover span{transform:translateX(4px)}
@media (max-width:900px){.fun-wrap{grid-template-columns:1fr;gap:30px}.funnel{height:360px}.fun-panel{min-height:0}}

/* --- metodología de campañas (showcase) --- */
.sc-info .desc{color:var(--muted);font-size:.95rem;max-width:40ch;margin:-12px 0 26px}
@media (max-width:900px){.sc-info .desc{margin-inline:auto}}
.sc-thumbs.four{grid-template-columns:repeat(4,1fr);max-width:720px;margin-inline:auto}
@media (max-width:900px){.sc-thumbs.four{grid-template-columns:repeat(4,1fr);grid-auto-flow:row;overflow:visible}}
@media (max-width:560px){.sc-thumbs.four{grid-template-columns:1fr 1fr}.sc-thumbs.four .thumb .mini{aspect-ratio:4/3}}
.slide .phase{position:absolute;top:22px;right:20px;font-family:var(--ff-d);font-weight:800;font-size:2.6rem;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(189,138,255,.4)}
/* 01 reconocimiento */
.s-rec{background:radial-gradient(circle at 50% 58%,#3d1a80,#120a22 70%)}
.s-rec .core{position:absolute;left:50%;top:58%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:18px;background:linear-gradient(140deg,#b07bff,#7c3df0);display:grid;place-items:center;box-shadow:0 0 40px -4px var(--accent);z-index:2}
.s-rec .core svg{width:34px;height:34px}
.s-rec .wave{position:absolute;left:50%;top:58%;width:80px;height:80px;margin:-40px 0 0 -40px;border-radius:50%;border:1.5px solid rgba(189,138,255,.6);opacity:0}
.slide.on.s-rec .wave{animation:ringOut 3s linear infinite}
.slide.on.s-rec .wave:nth-of-type(2){animation-delay:1s}.slide.on.s-rec .wave:nth-of-type(3){animation-delay:2s}
.s-rec .wave{transform-origin:center}
.s-rec .av{position:absolute;width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#ffb547,#ff4fd8);border:2px solid #120a22;opacity:0;transform:scale(0)}
.slide.on.s-rec .av{animation:avPop 7s var(--ease) infinite}
@keyframes avPop{0%{opacity:0;transform:scale(0)}8%,90%{opacity:1;transform:scale(1)}100%{opacity:0}}
.s-rec .kpi{margin-top:auto;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.07);border:1px solid var(--line-2);display:flex;justify-content:space-between;align-items:center;font-size:.66rem;color:var(--muted);font-weight:700;position:relative;z-index:3}
.s-rec .kpi b{font-family:var(--ff-d);font-size:1.15rem;color:#fff}
/* 02 posicionamiento */
.s-pos{background:linear-gradient(180deg,#1b0f36,#120a22)}
.s-pos .rank{display:grid;gap:12px;margin-top:26px}
.s-pos .r{display:grid;grid-template-columns:78px 1fr;gap:10px;align-items:center;font-size:.68rem;font-weight:700;color:var(--muted)}
.s-pos .r .bar{height:26px;border-radius:7px;background:rgba(255,255,255,.07);overflow:hidden}
.s-pos .r .bar i{display:block;height:100%;width:var(--w0);border-radius:inherit;background:rgba(255,255,255,.2)}
.s-pos .r.me{color:#fff}
.s-pos .r.me .bar i{background:linear-gradient(90deg,#7c3df0,var(--hl));box-shadow:0 0 20px -2px var(--accent)}
.slide.on.s-pos .r .bar i{animation:rankGrow 7s var(--ease) infinite}
@keyframes rankGrow{0%{width:var(--w0)}25%,90%{width:var(--w1)}100%{width:var(--w0)}}
.s-pos .trust{margin-top:auto;display:flex;gap:8px;flex-wrap:wrap}
.s-pos .trust span{padding:7px 10px;border-radius:9px;background:rgba(255,255,255,.07);border:1px solid var(--line-2);font-size:.62rem;font-weight:700;opacity:0}
.slide.on.s-pos .trust span{animation:word 7s var(--ease) infinite}
.slide.on.s-pos .trust span:nth-child(2){animation-delay:.4s}.slide.on.s-pos .trust span:nth-child(3){animation-delay:.8s}
/* 03 venta */
.s-ven{background:#0a0f0d}
.s-ven .eyb{color:var(--ok)}
.s-ven .ttl{font-size:1.3rem}
.wa-win{position:relative;flex:1;min-height:0;margin-top:12px;border-radius:14px;overflow:hidden;display:flex;flex-direction:column;background:#0b141a;border:1px solid rgba(255,255,255,.08);box-shadow:0 20px 40px -10px rgba(0,0,0,.7)}
.wa-hd{display:flex;align-items:center;gap:8px;padding:8px 10px;background:#1f2c34;flex:none}
.wa-hd svg{width:14px;height:14px;color:#aebac1;flex:none}
.wa-hd .av{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#ff9a6b,#d14fe0);flex:none}
.wa-hd b{display:block;font-size:.68rem;line-height:1.2}
.wa-hd small{display:block;font-size:.55rem;color:#8696a0;line-height:1.2}
.wa-hd small.typing{color:#25d366}
.wa-hd .icons{margin-left:auto;display:flex;gap:10px}
.wa-body{flex:1;min-height:0;padding:8px 8px 6px;display:flex;flex-direction:column;gap:5px;justify-content:flex-end;overflow:hidden;background-color:#0b141a;background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1px);background-size:11px 11px}
.wa-day{align-self:center;font-size:.5rem;font-weight:700;padding:3px 8px;border-radius:6px;background:#182229;color:#8696a0;margin-bottom:2px}
.wa-m{position:relative;max-width:84%;padding:5px 8px 13px;border-radius:8px;font-size:.64rem;line-height:1.35;flex:none}
.wa-m.in{align-self:flex-start;background:#202c33;border-top-left-radius:2px}
.wa-m.out{align-self:flex-end;background:#005c4b;border-top-right-radius:2px}
.wa-m time{position:absolute;right:6px;bottom:2px;font-size:.55rem;color:rgba(255,255,255,.55)}
.wa-m.out time::after{content:" ✓✓";color:#53bdeb;font-size:.5rem;letter-spacing:-1px}
.wa-m.card{display:flex;align-items:center;gap:8px}
.wa-m.card i{width:28px;height:28px;border-radius:7px;background:rgba(255,255,255,.12);display:grid;place-items:center;flex:none;font-style:normal}
.wa-m.card i svg{width:14px;height:14px}
.wa-m.card b{display:block;font-size:.62rem}
.wa-m.card small{font-size:.52rem;color:rgba(255,255,255,.65)}
.wa-typing{align-self:flex-start;background:#202c33;border-radius:8px;border-top-left-radius:2px;padding:8px 10px;display:flex;gap:3px;flex:none}
.wa-typing i{width:5px;height:5px;border-radius:50%;background:#8696a0;animation:waDot 1s ease-in-out infinite}
.wa-typing i:nth-child(2){animation-delay:.15s}.wa-typing i:nth-child(3){animation-delay:.3s}
@keyframes waDot{50%{transform:translateY(-3px);opacity:.5}}
.wa-in{display:flex;align-items:center;gap:6px;padding:6px 7px 7px;background:#0b141a;flex:none}
.wa-in .field{flex:1;min-height:28px;border-radius:14px;background:#2a3942;padding:5px 11px;font-size:.62rem;color:#e9edef;display:flex;align-items:center;overflow:hidden;white-space:nowrap}
.wa-in .field .ph{color:#a9b5bc}
.wa-in .field.typing::after{content:"";width:1.5px;height:12px;background:#00a884;margin-left:1px;animation:blink 1s steps(1) infinite}
.wa-in .snd{width:28px;height:28px;border-radius:50%;background:#00a884;display:grid;place-items:center;flex:none;transition:transform .2s}
.wa-in .snd.press{transform:scale(.85)}
.wa-in .snd svg{width:13px;height:13px;color:#fff}
.wa-sys{align-self:center;flex:none;display:inline-flex;align-items:center;gap:6px;margin-top:4px;padding:6px 12px;border-radius:999px;background:var(--ok);color:#06281a;font-size:.66rem;font-weight:800;box-shadow:0 8px 24px -6px rgba(65,224,164,.7)}
.wa-sys svg{width:12px;height:12px}
.wa-sys.late{background:#3a2a14;color:#ffcf8a;box-shadow:none;border:1px solid rgba(255,181,71,.35)}
/* 04 remarketing */
.s-rem{background:radial-gradient(circle at 50% 40%,#2d1660,#120a22 70%)}
.s-rem .loop{position:absolute;left:50%;top:52%;width:210px;height:210px;margin:-105px 0 0 -105px;border-radius:50%;border:1.5px dashed rgba(189,138,255,.35)}
.slide.on.s-rem .loop{animation:spinR 14s linear infinite}
.s-rem .steps{position:relative;z-index:2;margin-top:18px;display:grid;gap:8px}
.s-rem .st{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:11px;background:rgba(255,255,255,.06);border:1px solid var(--line);font-size:.68rem;font-weight:700;opacity:.3}
.s-rem .st i{width:22px;height:22px;border-radius:7px;flex:none;display:grid;place-items:center;font-style:normal;font-size:.6rem;background:rgba(255,255,255,.1)}
.slide.on.s-rem .st{animation:stOn 7s var(--ease) infinite}
.slide.on.s-rem .st:nth-child(2){animation-delay:1.1s}.slide.on.s-rem .st:nth-child(3){animation-delay:2.2s}
@keyframes stOn{0%,4%{opacity:.3}10%,92%{opacity:1}100%{opacity:.3}}
.s-rem .ad{position:relative;z-index:2;margin-top:auto;padding:12px;border-radius:14px;background:#fff;color:#1b0b3a;transform:translateY(140%)}
.slide.on.s-rem .ad{animation:adIn 7s var(--ease) infinite 3s}
@keyframes adIn{0%{transform:translateY(140%)}10%,88%{transform:none}100%{transform:translateY(140%)}}
.s-rem .ad small{display:block;font-size:.56rem;font-weight:800;letter-spacing:.1em;color:#7a3ee0}
.s-rem .ad b{display:block;font-family:var(--ff-d);font-size:.95rem;line-height:1.15;margin:4px 0 8px}
.s-rem .ad span{display:inline-block;padding:6px 10px;border-radius:8px;background:#7a3ee0;color:#fff;font-size:.62rem;font-weight:800}


/* ---------- movimiento reducido ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
}

/* contador del precio: baja de 200 a 0 */
.price .val{font-variant-numeric:tabular-nums;transition:filter .4s}
.price .val.hit{animation:priceHit .8s var(--ease)}
@keyframes priceHit{0%{transform:scale(1)}35%{transform:scale(1.18)}100%{transform:scale(1)}}
.price .val.hit ~ .ring{animation:ringFlash 1s var(--ease)}
@keyframes ringFlash{30%{border-color:var(--hl);box-shadow:0 0 30px -4px var(--accent)}}
.ofr .pay b{transition:color .4s}
.ofr .pay.free b{color:var(--ok)}

/* =========================================================
   Mejoras de la revisión de diseño (Impeccable)
   ========================================================= */
/* encabezado con acción */
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px}
.top-actions{display:flex;align-items:center;gap:14px}
.btn-sm{min-height:44px;padding:0 18px;font-size:.84rem}

/* hero: botón principal visible al llegar */
.hero-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:18px 24px;margin-top:30px}
.link-arrow{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700;font-size:.92rem;color:var(--paper);text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--line-2)}
.link-arrow:hover{text-decoration-color:var(--hl)}
.cta-note{margin-top:12px;font-size:.84rem;color:var(--muted)}
.pillars{gap:10px 22px;margin-top:30px}
.pillar{padding:0;border:0;background:none;font-size:.86rem;font-weight:600;color:#d9cdee}
.sec-cta{margin-top:44px;text-align:center}

/* oferta con título */
.ofr-title{font-size:clamp(1.8rem,4vw,2.6rem);letter-spacing:-.045em;margin:0 0 14px}

/* prueba real: testimonios y Reels */
.proof-head{display:grid;gap:12px;max-width:720px;margin-bottom:40px}
.proof-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.testi{margin:0;padding:26px;border-radius:20px;border:1px solid var(--line-2);background:linear-gradient(180deg,#160e2b,#0f0a1e);display:flex;flex-direction:column;gap:18px}
.testi-result{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:12px;background:rgba(65,224,164,.08);border:1px solid rgba(65,224,164,.25);font-size:.9rem}
.testi-result small{display:block;font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.testi-result b{color:var(--ok);font-family:var(--ff-d)}
.testi-result i{font-style:normal;color:var(--muted)}
.testi blockquote{margin:0;font-size:1.02rem;line-height:1.55}
.testi figcaption{margin-top:auto;display:flex;align-items:center;gap:12px;font-size:.86rem;color:var(--muted)}
.testi figcaption img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.testi figcaption b{display:block;color:var(--paper)}
.reels{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px;margin-top:28px}
.reels:empty{display:none}
.reel{margin:0}
.reel video{width:100%;aspect-ratio:9/16;border-radius:18px;background:#120a22;object-fit:cover}
.reel figcaption{margin-top:10px;font-size:.86rem;color:var(--muted)}

/* pie de página */
.foot-links{display:flex;gap:18px;margin-top:18px}
.foot-links a{min-height:44px;display:inline-flex;align-items:center;font-weight:700;color:var(--paper);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line-2)}

/* celular: botón fijo para agendar */
.m-cta{display:none}
@media (max-width:760px){
  .m-cta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(11,7,22,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line)}
  .m-cta .btn{width:100%;min-height:52px}
  .wa{display:none}
  body{padding-bottom:76px}
  .top-actions .btn-sm{display:none}
  .ed-brand{font-size:.85rem}
  .hero-ctas .btn{width:100%}
}
@media (max-width:900px){
  .skills .sk-phone{order:-1;max-width:260px}
}

/* sin JavaScript o con movimiento reducido el contenido siempre se ve */
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none}}
.flow-bar span.on{background:#6b2bd9}
.fun-tabs button.on,.fun-acr span:first-child{color:#0b0716}

/* =========================================================
   Rediseño: VSL 16:9, escenas de Instagram, cristal y agente IA
   ========================================================= */
::selection{background:rgba(151,89,255,.45);color:#fff}

/* ---------- cristal compartido (superficies oscuras) ---------- */
.fun-panel,.editor,.rep,.agent,.pub-band,.testi{
  position:relative;
  background:linear-gradient(155deg,rgba(255,255,255,.085),rgba(255,255,255,.02) 45%,rgba(151,89,255,.05));
  border:1px solid rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 30px 80px -40px rgba(151,89,255,.55),0 12px 30px -18px rgba(0,0,0,.6)}
.pub-band{background:linear-gradient(120deg,rgba(27,16,51,.92),rgba(18,10,34,.86));border-color:rgba(255,255,255,.14)}

/* ---------- HERO tipo VSL: titular, video 16:9 y llamada a la acción ---------- */
.hero{grid-template-columns:1fr;justify-items:center;text-align:center;gap:0;min-height:0;padding:34px 0 80px}
.hero-copy{max-width:860px;display:grid;justify-items:center}
.hero h1{font-size:clamp(2.3rem,5.4vw,4.2rem);margin:6px 0 18px;text-wrap:balance}
.hero .lead{font-size:clamp(.95rem,1.4vw,1.08rem);max-width:62ch;text-wrap:pretty}
.vsl{width:min(920px,100%);aspect-ratio:16/9;margin-top:40px;border-radius:24px;padding:6px;justify-self:center;
  box-shadow:0 40px 120px -40px rgba(151,89,255,.75),0 0 0 1px rgba(255,255,255,.08)}
.vsl-screen{border-radius:19px}
.vsl-ph img{object-position:50% 22%}
.vsl-ph::after{background:linear-gradient(180deg,rgba(11,7,22,.55),transparent 28%,transparent 60%,rgba(11,7,22,.8))}
.vsl-top{top:18px;left:20px;right:20px;display:flex;align-items:center;gap:12px;text-align:left}
.vsl-top .rec{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:rgba(11,7,22,.55);border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.vsl-top .rec i{width:7px;height:7px;border-radius:50%;background:#ff4f6d;animation:pulse 1.6s infinite}
.vsl-top b{font-family:var(--ff-d);font-size:clamp(.9rem,1.6vw,1.15rem);letter-spacing:-.03em;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.vsl-play{width:auto;display:grid;justify-items:center;gap:14px;padding:22px 30px 20px;border-radius:20px;
  background:rgba(20,10,42,.42);border:1px solid rgba(255,255,255,.2);-webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 24px 60px -20px rgba(0,0,0,.6);animation:none;transition:transform .3s var(--ease),background .3s}
.vsl-play:hover{transform:translate(-50%,-50%) scale(1.04);background:rgba(124,61,240,.55)}
.vsl-play .ring{position:relative;width:74px;height:74px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(150deg,#8a45e6,#5b21c4);box-shadow:0 10px 40px -6px rgba(124,61,240,.9)}
.vsl-play .ring::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:2px solid rgba(189,138,255,.6);animation:waRing 2.2s ease-out infinite}
.vsl-play .ring svg{width:30px;height:30px;margin:0}
.vsl-play b{font-size:clamp(1rem,1.8vw,1.3rem)}
.vsl-chrome{position:absolute;left:20px;right:20px;bottom:16px;z-index:2;display:flex;align-items:center;gap:12px;font-size:.72rem;font-weight:700;color:rgba(255,255,255,.8)}
.vsl-chrome .vsl-bar{position:static;display:block;flex:1;height:4px}
.vsl-bar i{width:0;animation:none}
.vsl.has-video .vsl-bar i{width:30%;animation:vbar 10s linear infinite}
.hero-foot{display:grid;justify-items:center;margin-top:34px}
.hero-ctas{justify-content:center;margin-top:0}
.pillars{justify-content:center}
@media (max-width:900px){.vsl{width:100%;margin-top:30px}}
@media (max-width:560px){
  .vsl{border-radius:18px;padding:4px}.vsl-screen{border-radius:15px}
  .vsl-top{top:12px;left:12px;right:12px}.vsl-top b{display:none}
  .vsl-play{padding:12px 18px;gap:8px;border-radius:14px}.vsl-play .ring{width:50px;height:50px}.vsl-play .ring svg{width:22px;height:22px}
  .vsl-play b{font-size:.86rem}.vsl-chrome{left:12px;right:12px;bottom:10px}
}

/* ---------- PROBLEMA: tarjetas de cristal claro con pantallas reales de Instagram ---------- */
.pub-cards{gap:24px;align-items:stretch}
.pcard{display:flex;flex-direction:column;padding:12px 12px 26px;border-radius:28px;
  background:linear-gradient(160deg,rgba(255,255,255,.62),rgba(255,255,255,.28));
  border:1px solid rgba(255,255,255,.75);
  -webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);
  box-shadow:inset 0 1px 0 #fff,0 30px 60px -34px rgba(60,20,120,.5),0 8px 20px -14px rgba(60,20,120,.3)}
.pcard>.meta,.pcard>h3,.pcard>p{padding-inline:10px}
.pcard>.meta{margin-top:6px;gap:8px;color:#3d1a86}
.pcard .ill.ig{height:430px;margin-bottom:18px;border-radius:20px;background:#000;color:#f5f5f5;font-size:.72rem;line-height:1.35;
  box-shadow:0 20px 40px -22px rgba(30,6,70,.8),inset 0 0 0 1px rgba(255,255,255,.06);display:flex;flex-direction:column}

/* logos de plataformas */
.brand{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;flex:none;font-style:normal;vertical-align:middle}
.brand svg{width:64%;height:64%}
.brand.b-ig{background:radial-gradient(circle at 30% 107%,#fdf497 0,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.brand.b-wa{background:#25d366;border-radius:50%}
.brand.b-wa svg{width:70%;height:70%}
.brand.b-fb{background:#1877f2;border-radius:50%}
.brand.b-fb svg{width:78%;height:78%}
.brand.b-mt{background:#fff}
.brand.b-mt svg{width:82%;height:82%}
.brand.sm{width:22px;height:22px;border-radius:6px}
.brand.xs{width:16px;height:16px;border-radius:5px}
.brand.b-wa.sm,.brand.b-wa.xs,.brand.b-fb.sm,.brand.b-fb.xs{border-radius:50%}
.glass .gh i.brand{border-radius:8px}
.glass .gh i.brand.b-ig{background:radial-gradient(circle at 30% 107%,#fdf497 0,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.glass .gh i.brand.b-wa{background:#25d366;border-radius:50%}
.glass .gh i.brand.b-mt{background:#fff}
.glass .gh i.brand.b-mt svg{width:20px;height:20px}
.chip .brand.xs{width:18px;height:18px}
.ag-lbl b{display:inline-flex;align-items:center;gap:8px}
.platforms{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 20px;margin-top:22px;font-size:.84rem;font-weight:700;color:#e3d9f3}
.platforms small{font-size:.74rem;font-weight:600;color:var(--muted)}
.platforms>span{display:inline-flex;align-items:center;gap:8px}
.platforms .brand{width:24px;height:24px;border-radius:7px}
.platforms .brand.b-wa,.platforms .brand.b-fb{border-radius:50%}

/* fotos del perfil ficticio: si la imagen no existe, queda el degradado */
.ph{background-image:var(--img),linear-gradient(150deg,var(--g1,#7c3df0),var(--g2,#3a1590));background-size:cover;background-position:center;background-repeat:no-repeat}

/* piezas comunes de Instagram (modo oscuro) */
.ig-bar,.ig-top{display:flex;align-items:center;gap:10px;padding:11px 14px 9px;flex:none}
.ig-bar b{font-size:.92rem;letter-spacing:-.01em}
.ig-top b{font-size:.9rem}
.ig-ico{width:20px;height:20px;flex:none;color:#f5f5f5}
.ig-bar .ig-ico:first-of-type,.ig-top .push{margin-left:auto}
.ig-chev{width:14px;height:14px;margin-left:-6px}
.ig-hd{display:flex;align-items:center;gap:10px;padding:6px 14px 10px;flex:none}
.ig-av{position:relative;isolation:isolate;width:32px;height:32px;border-radius:50%;flex:none;background-image:var(--img),linear-gradient(135deg,#7c3df0,#d14fe0);background-size:cover;background-position:center}
.ig-av.story{border:2px solid #000}
.ig-av.story::before{content:"";position:absolute;inset:-4px;z-index:-1;border-radius:50%;background:linear-gradient(45deg,#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5)}
.ig-av.big{width:62px;height:62px;border-width:3px}
.ig-who{display:grid;line-height:1.2;min-width:0}
.ig-who b{font-size:.76rem}
.ig-who small{font-size:.64rem;color:#a8a8a8}
.ig-more{width:18px;height:18px;margin-left:auto;color:#f5f5f5;flex:none}

/* 01 · anuncio en el feed */
.ig-media{position:relative;flex:1;min-height:0;overflow:hidden;--g1:#d14fe0;--g2:#3a1590}
.ig-sticker{position:absolute;top:10px;left:10px;padding:4px 9px;border-radius:8px;background:#fff;color:#1b0f33;font-family:var(--ff-d);font-weight:800;font-size:.9rem;letter-spacing:-.03em;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.ig-burst{position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;color:#fff;opacity:0;filter:drop-shadow(0 6px 18px rgba(0,0,0,.35));animation:igBurst 3.2s var(--ease) infinite}
@keyframes igBurst{0%,8%{opacity:0;transform:scale(.3)}16%{opacity:1;transform:scale(1.1)}24%{transform:scale(.95)}34%{opacity:1;transform:scale(1)}46%,100%{opacity:0;transform:scale(1.1)}}
.ig-media .fly{position:absolute;left:12%;bottom:6px;width:16px;height:16px;color:#ff3040;opacity:0;animation:flyUp 3s ease-out infinite}
.ig-media .fly:nth-of-type(3){left:20%;animation-delay:.7s}.ig-media .fly:nth-of-type(4){left:8%;animation-delay:1.4s}.ig-media .fly:nth-of-type(5){left:16%;animation-delay:2.1s}
.ig-sales{position:absolute;right:10px;bottom:10px;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(0,0,0,.7);border:1px solid rgba(255,84,112,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:.66rem;font-weight:700}
.ig-sales svg{width:14px;height:14px;color:#ff8095}
.ig-sales b{font-family:var(--ff-d);font-size:.9rem;color:#ff6b84}
.ig-cta{display:flex;align-items:center;justify-content:space-between;padding:8px 14px;background:#0095f6;color:#fff;font-size:.74rem;font-weight:700;flex:none}
.ig-cta svg{width:14px;height:14px}
.ig-act{display:flex;align-items:center;gap:14px;padding:9px 14px 4px;flex:none}
.ig-act svg{width:22px;height:22px;color:#f5f5f5}
.ig-act .liked{color:#ff3040;animation:hb 1.3s ease-in-out infinite}
.ig-act .ig-save{margin-left:auto}
.ig-likes{padding:2px 14px 2px;font-size:.72rem;flex:none}
.ig-likes b{font-variant-numeric:tabular-nums}
.ig-cap{padding:2px 14px 12px;font-size:.7rem;color:#e6e6e6;flex:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ig-cap span{color:#a8a8a8}

/* 02 · perfil */
.ig-head{display:flex;align-items:center;gap:16px;padding:6px 14px 8px;flex:none}
.ig-stats{flex:1;display:grid;grid-template-columns:repeat(3,1fr);text-align:center}
.ig-stats span{display:grid;font-size:.62rem;color:#f5f5f5}
.ig-stats b{font-size:.9rem;font-variant-numeric:tabular-nums}
.ig-bio{display:grid;padding:0 14px 8px;font-size:.68rem;line-height:1.35;flex:none}
.ig-bio b{font-size:.72rem}
.ig-bio small{color:#a8a8a8;font-size:.64rem}
.ig-btns{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:0 14px 10px;flex:none}
.ig-btns span{padding:6px 0;border-radius:8px;background:#363636;text-align:center;font-size:.68rem;font-weight:700}
.ig-tabs{display:grid;grid-template-columns:repeat(3,1fr);justify-items:center;padding:6px 0;border-top:1px solid #262626;flex:none}
.ig-tabs svg{width:20px;height:20px;color:#a8a8a8}
.ig-tabs svg:first-child{color:#f5f5f5}
.ig-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(3,1fr);align-content:start;gap:2px;overflow:hidden;
  mask-image:linear-gradient(180deg,#000 75%,transparent);-webkit-mask-image:linear-gradient(180deg,#000 75%,transparent)}
.ig-grid .t{position:relative;aspect-ratio:1;overflow:hidden}
.ig-grid .t.new{animation:igNew 4s var(--ease) infinite}
.ig-grid .t em{position:absolute;top:6px;left:6px;padding:2px 6px;border-radius:4px;background:#fff;color:#1b0f33;font-style:normal;font-size:.5rem;font-weight:800;animation:igTag 4s var(--ease) infinite}
@keyframes igNew{0%{transform:scale(.4);opacity:0}12%{transform:scale(1.04);opacity:1}20%,100%{transform:none}}
@keyframes igTag{0%,10%{opacity:0}18%,80%{opacity:1}100%{opacity:0}}
.ig-inbox{display:flex;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid #262626;font-size:.7rem;font-weight:600;flex:none}
.ig-inbox svg{width:16px;height:16px;color:#f5f5f5}
.ig-inbox span{margin-left:auto;padding:3px 9px;border-radius:999px;background:rgba(255,84,112,.16);color:#ff8095;font-size:.62rem;font-weight:800}

/* 03 · mensajes directos */
.ig-search{display:flex;align-items:center;gap:8px;margin:2px 14px 10px;padding:7px 10px;border-radius:10px;background:#262626;color:#a8a8a8;font-size:.7rem;flex:none}
.ig-search svg{width:14px;height:14px}
.dm-tabs{display:flex;justify-content:space-between;padding:0 14px 6px;font-size:.74rem;flex:none}
.dm-tabs span{color:#a8a8a8;display:inline-flex;align-items:center;gap:5px;font-weight:600}
.dm-tabs span i{font-style:normal;padding:0 6px;border-radius:999px;background:#ff3040;color:#fff;font-size:.56rem;font-weight:800;line-height:1.5}
.dm{display:flex;align-items:center;gap:11px;padding:8px 14px;animation:chatIn 6s ease-in-out infinite;animation-delay:calc(var(--i)*.4s)}
.dm>i{width:44px;height:44px;border-radius:50%;flex:none;--g1:var(--a);--g2:var(--b)}
.dm>span{display:grid;min-width:0;font-size:.68rem;color:#f5f5f5;font-weight:700;line-height:1.35}
.dm>span b{font-size:.74rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm em{margin-left:auto;flex:none;display:grid;justify-items:end;gap:4px;font-style:normal;font-size:.54rem;font-weight:800;color:#ff8095}
.dm em::after{content:"";width:8px;height:8px;border-radius:50%;background:#0095f6}

@media (max-width:900px){
  .pub-cards{gap:28px;max-width:440px;margin-inline:auto}
}

/* ---------- AGENTE IA: interruptor + WhatsApp + habilidades en una sola pieza ---------- */
.agent{border-radius:26px;padding:18px;overflow:hidden;isolation:isolate}
.agent::before{content:"";position:absolute;inset:auto -20% -40% -20%;height:70%;z-index:-1;background:radial-gradient(closest-side,rgba(65,224,164,.22),transparent);opacity:0;transition:opacity .8s}
.agent.on::before{opacity:1}
.ag-top{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);margin-bottom:14px}
.ag-top .sw{width:52px;height:30px;flex:none}
.ag-top .sw::after{top:4px;left:4px;width:22px;height:22px;box-shadow:0 2px 6px rgba(0,0,0,.4)}
.ag-top .sw[aria-checked="true"]{background:#25d366;box-shadow:0 0 24px -4px rgba(37,211,102,.8)}
.ag-top .sw[aria-checked="true"]::after{transform:translateX(22px)}
.ag-top .sw[aria-checked="false"]{animation:swHint 2.4s ease-in-out infinite}
@keyframes swHint{50%{box-shadow:0 0 0 6px rgba(151,89,255,.25)}}
.ag-lbl{display:grid;line-height:1.25;min-width:0}
.ag-lbl b{font-size:.98rem;white-space:nowrap}
.ag-lbl span{font-size:.78rem;color:var(--muted)}
.agent.on .ag-lbl span{color:#8ef0c9}
.ag-top .cnt{margin-left:auto;flex:none;padding:5px 10px;border-radius:8px;border:1px solid var(--line-2);font-size:.72rem;font-weight:800;font-variant-numeric:tabular-nums}
.ag-body{display:grid;grid-template-columns:1.15fr .85fr;gap:14px;align-items:stretch}
.ag-chat{height:400px;display:flex;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.1);background:#0b141a}
.ag-chat .wa-win{margin:0;border:0;border-radius:0;box-shadow:none}
.ag-chat .wa-hd{padding:10px 12px}
.ag-chat .wa-hd .av{width:32px;height:32px}
.ag-chat .wa-hd b{font-size:.8rem}
.ag-chat .wa-hd small{font-size:.66rem}
.ag-chat .tagl{margin-left:auto;padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.1);font-size:.56rem;font-weight:800;letter-spacing:.08em;white-space:nowrap;transition:background .3s}
.agent.on .ag-chat .tagl{background:#25d366;color:#05301a}
.ag-chat .wa-body{gap:6px;padding:10px 10px 8px}
.ag-chat .wa-day{font-size:.58rem}
.ag-chat .wa-m{font-size:.76rem;padding:6px 9px 15px;max-width:86%}
.ag-chat .wa-m time{font-size:.58rem}
.ag-chat .wa-m.card b{font-size:.74rem}.ag-chat .wa-m.card small{font-size:.62rem}
.ag-chat .wa-m.ai::before{content:"Agente IA";display:block;font-size:.58rem;font-weight:800;letter-spacing:.04em;color:#8ef0c9;margin-bottom:2px}
.ag-chat .wa-sys{font-size:.72rem}
.ag-chat .wa-in .field{font-size:.72rem;min-height:32px}
.ag-chat .wa-in .snd{width:32px;height:32px}
.wa-typing.ai{align-self:flex-end;align-items:center;gap:4px;background:#005c4b;border-radius:8px;border-top-right-radius:2px}
.wa-typing.ai span{font-size:.62rem;font-weight:700;color:#c9f7e4;margin-right:4px}
.wa-typing.ai i{background:#c9f7e4}
.ag-side{display:flex;flex-direction:column;gap:10px;min-width:0}
.ag-cap{font-size:.66rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--hl)}
.ag-side .sk-rows{gap:8px}
.ag-side .sk-row{padding:10px 12px;font-size:.84rem;background:rgba(255,255,255,.02);flex-wrap:wrap}
.ag-side .sk-row i{width:26px;height:26px}
.ag-side .sk-row i svg{width:14px;height:14px}
.ag-side .sk-row small{flex-basis:100%;margin-left:36px;margin-top:-4px;font-size:.7rem;opacity:.55}
.ag-side .sk-row.on small{opacity:1}
.agent.on .sk-row.on i{background:#25d366;color:#05301a}
.ag-side .ans{margin-top:auto;padding:12px 14px;border-radius:12px;border:1px dashed var(--line-2);font-size:.8rem;line-height:1.45;color:var(--muted);transition:.4s}
.ag-side .ans.good{border-style:solid;border-color:rgba(65,224,164,.4);color:#c9f7e4;background:rgba(65,224,164,.07)}
@media (max-width:1060px) and (min-width:901px){.bon-block{grid-template-columns:.8fr 1.2fr}}
@media (max-width:640px){
  .agent{padding:12px;border-radius:22px}
  .ag-body{grid-template-columns:1fr}
  .ag-chat{height:360px}
  .ag-top{padding:10px 12px;gap:12px}
}
@media (max-width:420px){.slide .ttl{font-size:1.35rem}.s-ven .ttl{font-size:1.15rem}}
.dm-foot{margin-top:auto}

/* ---------- DIAGNÓSTICO 360°: dial de cristal interactivo ---------- */
.ofr{padding-bottom:52px}
.dx{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center;max-width:680px;margin:40px auto 56px;text-align:left}
.dx-dial{--size:260px;--r:calc(var(--size) / -2 + 9px);position:relative;width:var(--size);height:var(--size);border-radius:50%;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;isolation:isolate}
.dx-dial.drag{cursor:grabbing}
.dx-dial::before{content:"";position:absolute;inset:-18%;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(151,89,255,.38),transparent);transition:background .6s}
.dx-dial.full::before{background:radial-gradient(closest-side,rgba(65,224,164,.3),transparent)}
.dx-ring{position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(#9759ff 0deg,#ff4fd8 calc(var(--deg) * .55),#41e0a4 var(--deg),rgba(255,255,255,.09) var(--deg) 360deg);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 18px),#000 calc(100% - 17px));mask:radial-gradient(farthest-side,transparent calc(100% - 18px),#000 calc(100% - 17px))}
.dx-node,.dx-knob{position:absolute;left:50%;top:50%;border-radius:50%;pointer-events:none}
.dx-node{width:8px;height:8px;margin:-4px 0 0 -4px;background:rgba(255,255,255,.35);transform:rotate(var(--a)) translateY(var(--r));transition:background .3s,box-shadow .3s}
.dx-node.on{background:#fff;box-shadow:0 0 10px 2px rgba(65,224,164,.9)}
.dx-knob{width:22px;height:22px;margin:-11px 0 0 -11px;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.18),0 0 22px 4px rgba(189,138,255,.9);transform:rotate(var(--deg)) translateY(var(--r))}
.dx-core{position:absolute;inset:30px;border-radius:50%;display:grid;place-content:center;justify-items:center;text-align:center;gap:4px;
  background:linear-gradient(155deg,rgba(255,255,255,.16),rgba(255,255,255,.03) 55%,rgba(151,89,255,.1));
  border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(16px) saturate(150%);backdrop-filter:blur(16px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 -20px 40px -20px rgba(151,89,255,.5),0 20px 50px -20px rgba(0,0,0,.7)}
.dx-core b{font-family:var(--ff-d);font-size:3.4rem;line-height:1;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.dx-core small{max-width:13ch;font-size:.74rem;font-weight:700;color:var(--hl);line-height:1.3;min-height:2.6em}
.dx-dial.full .dx-core small{color:var(--ok)}
.dx-dial:focus-visible{outline:2px solid var(--hl);outline-offset:6px;border-radius:50%}
.dx-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.dx-list button{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;text-align:left;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);transition:background .35s,border-color .35s,opacity .35s;opacity:.55}
.dx-list button:hover{opacity:1;background:rgba(255,255,255,.06)}
.dx-list .n{flex:none;width:46px;padding:4px 0;border-radius:8px;background:rgba(255,255,255,.06);text-align:center;font-size:.7rem;font-weight:800;font-variant-numeric:tabular-nums;color:var(--muted);transition:.35s}
.dx-list b{display:block;font-size:.88rem}
.dx-list small{display:block;font-size:.74rem;color:var(--muted);margin-top:1px}
.dx-list li.on button{opacity:1;border-color:rgba(65,224,164,.28)}
.dx-list li.on .n{background:rgba(65,224,164,.16);color:#8ef0c9}
.dx-list li.cur button{background:rgba(151,89,255,.16);border-color:rgba(189,138,255,.45)}
@media (max-width:700px){
  .dx{grid-template-columns:1fr;justify-items:center;gap:30px;margin:32px auto 44px}
  .dx-dial{--size:min(250px,72vw)}
  .dx-list{width:100%}
  .dx-core{inset:26px}.dx-core b{font-size:2.8rem}
}

/* botón secundario de cristal */
.btn-ghost{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 10px 30px -14px rgba(0,0,0,.6)}
.btn-ghost:hover{background:rgba(151,89,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 12px 36px -10px rgba(136,57,233,.5)}
.evo-link{margin-top:30px;min-height:52px;font-size:.9rem}

/* una sola columna: todo centrado y con menos aire vacío */
@media (max-width:900px){
  .section{padding:80px 0}
  .evo{justify-items:center;text-align:center;gap:40px}
  .evo-art{width:100%;max-width:420px;margin-inline:auto}
  .evo-txt{max-width:560px}
  .evo-txt p{margin-inline:auto}
  .evo-txt hr{margin:26px auto}
  .evo-h span{transform:none}
  .inst{justify-items:center;text-align:center}
  .inst-img{width:100%;max-width:380px;margin-inline:auto}
  .inst p.t{margin-inline:auto}
  .inst .partner{display:inline-grid;text-align:left;margin-inline:auto}
}
@media (max-width:560px){.section{padding:64px 0}}
@media (max-width:560px){.price .ring{display:none}.price{margin-top:56px}}



/* ---------- METODOLOGÍA (versión B): encabezado ordenado, nueva tipografía y escenas con más detalle ---------- */
.sc-frame{background:linear-gradient(170deg,rgba(255,255,255,.35),rgba(151,89,255,.12) 40%,rgba(151,89,255,.45))}
.sc-screen::after{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.07),transparent 22%)}
.slide{text-align:left;padding:18px 18px 34px}
.slide .eyb{position:relative;z-index:2;margin:0;align-self:flex-start;padding:5px 10px;border-radius:999px;background:rgba(151,89,255,.16);border:1px solid rgba(189,138,255,.3);font-size:.58rem}
.s-ven .eyb{background:rgba(65,224,164,.12);border-color:rgba(65,224,164,.32)}
.slide .phase{top:18px;right:18px;z-index:2;padding:5px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);font-family:var(--ff-b);font-size:.58rem;font-weight:800;letter-spacing:.1em;line-height:1.3;color:#e6dcf7;-webkit-text-stroke:0}
.slide .phase::after{content:" / 04";color:var(--muted)}
.slide .ttl{position:relative;z-index:2;margin-top:16px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.08);
  font-family:"Bricolage Grotesque",var(--ff-b);font-weight:800;font-stretch:78%;font-size:2.25rem;line-height:.9;letter-spacing:-.015em;text-transform:uppercase}
.s-ven .ttl,.s-rem .ttl{font-size:1.95rem}
@media (max-width:420px){.slide .ttl{font-size:1.9rem}.s-ven .ttl,.s-rem .ttl{font-size:1.65rem}}

/* paso 1: personas alrededor de la marca */
.s-rec .core,.s-rec .wave{top:60%}
.s-rec .av{width:34px;height:34px;display:grid;place-items:end center;overflow:hidden;border:2px solid rgba(255,255,255,.85);background:linear-gradient(150deg,var(--c1,#ffb547),var(--c2,#ff4fd8));box-shadow:0 6px 16px -4px rgba(0,0,0,.5)}
.s-rec .av svg{width:76%;height:76%;color:rgba(255,255,255,.92);margin-bottom:-2px}
.s-rec .kpi{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}

/* paso 2: ranking con íconos de cristal 3D */
.s-pos .rank{margin:auto 0;padding:14px;border-radius:16px;gap:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}
.s-pos .r{grid-template-columns:34px 76px 1fr;text-align:left}
.s-pos .trust{margin-top:0;justify-content:flex-start}
.g3d{position:relative;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:#fff;
  background:linear-gradient(145deg,rgba(255,255,255,.38),rgba(255,255,255,.06) 55%,rgba(255,255,255,.16));
  border:1px solid rgba(255,255,255,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.7),inset 0 -6px 10px -4px rgba(0,0,0,.35),0 8px 14px -6px rgba(0,0,0,.6);
  transform:perspective(120px) rotateX(10deg) rotateY(-12deg)}
.g3d::before{content:"";position:absolute;left:4px;right:10px;top:3px;height:38%;border-radius:8px 8px 14px 14px;background:linear-gradient(180deg,rgba(255,255,255,.55),transparent);pointer-events:none}
.g3d svg{position:relative;width:18px;height:18px;filter:drop-shadow(0 2px 2px rgba(0,0,0,.35))}
.s-pos .r .g3d{color:#d9d2e8}
.s-pos .r.me .g3d{background:linear-gradient(145deg,#c9a6ff,#7c3df0 55%,#5b21c4);border-color:rgba(255,255,255,.55);box-shadow:inset 0 1px 1px rgba(255,255,255,.8),inset 0 -6px 10px -4px rgba(40,0,90,.6),0 10px 20px -6px rgba(151,89,255,.9)}

/* paso 3: se reconoce como WhatsApp */
.s-ven .wa-win{margin-top:12px}
.wa-brand{display:flex;align-items:center;gap:6px;padding:6px 10px;background:#111b21;border-bottom:1px solid rgba(255,255,255,.06);font-size:.62rem;font-weight:800;color:#e9edef;flex:none}
.wa-brand small{font-weight:600;color:#25d366}
.wa-brand .wa-lock{margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-size:.52rem;font-weight:600;color:#8696a0}
.wa-brand .wa-lock svg{width:10px;height:10px}
.s-ven .wa-body{background-color:#0b141a;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' fill='none' stroke='%23ffffff' stroke-opacity='.05' stroke-width='1.2'%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Cpath d='M40 8l6 6-6 6-6-6z'/%3E%3Cpath d='M8 44h10M13 39v10'/%3E%3Cpath d='M38 40c4-4 10 0 6 5l-3 3-3-3c-4-5 2-9 0-5z'/%3E%3C/svg%3E");background-size:60px 60px}
.s-ven .wa-hd .icons{gap:9px}

/* paso 4: vuelven, compran y recomiendan */
.s-rem .steps{margin-top:12px;gap:6px}
.s-rem .st{padding:7px 10px}
.s-rem .st i{width:24px;height:24px;border-radius:7px;background:rgba(151,89,255,.25)}
.s-rem .st i svg{width:13px;height:13px}
.s-rem .st:nth-child(2) i{background:rgba(65,224,164,.22);color:#8ef0c9}
.s-rem .st:nth-child(3) i{background:rgba(255,181,71,.2);color:#ffcf8a}
.s-rem .rec{position:relative;z-index:2;margin-top:10px;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0}
.slide.on.s-rem .rec{animation:recIn 7s var(--ease) infinite 2.4s}
@keyframes recIn{0%{opacity:0;transform:translateY(10px) scale(.96)}8%,90%{opacity:1;transform:none}100%{opacity:0}}
.rec-av{width:30px;height:30px;border-radius:50%;flex:none;display:grid;place-items:end center;overflow:hidden;background:linear-gradient(150deg,#ff7b9c,#d14fe0);border:2px solid rgba(255,255,255,.8)}
.rec-av svg{width:76%;height:76%;color:#fff;margin-bottom:-2px}
.rec-tx{display:grid;min-width:0;line-height:1.25}
.rec-tx .stars{color:#ffb547;font-size:.66rem;letter-spacing:1.5px}
.rec-tx b{font-size:.64rem;font-weight:700}
.rec-share{margin-left:auto;width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;background:rgba(255,48,64,.18);color:#ff5470}
.rec-share svg{width:13px;height:13px}
.s-rem .ad{padding:10px 12px}
.s-rem .ad b{font-size:.86rem;margin:3px 0 6px}

/* EVO: titular, imagen y texto en una grilla; en una columna el titular va primero */
.evo{grid-template-areas:"art h" "art t";grid-template-rows:1fr auto;row-gap:0}
.evo-h{grid-area:h;align-self:end;margin-bottom:4px}
.evo-art{grid-area:art}
.evo-txt{grid-area:t;align-self:start}
@media (max-width:900px){
  .evo{grid-template-areas:"h" "art" "t";grid-template-rows:auto;row-gap:34px}
  .evo-h{max-width:640px;text-align:center}
}

/* ---------- Sección clara (fondo blanco) para cortar lo oscuro ---------- */
.light{background:radial-gradient(60% 60% at 100% 0%,#f1eafd 0%,rgba(241,234,253,0) 70%),radial-gradient(50% 55% at 0% 100%,#ebe1fb 0%,rgba(235,225,251,0) 70%),#fbf9ff;color:#1b0f33}
.light .hl{color:#5b21c4}
.light .evo-h span{opacity:.18}
.light .evo-h span.on{opacity:1}
.light .evo-txt p{color:#4b3d66}
.light .evo-txt p b{color:#1b0f33}
.light .evo-txt hr{background:linear-gradient(90deg,#7c3df0,transparent)}
.light .evo-txt .strong{color:#1b0f33}
.light .evo-art{border-color:rgba(91,33,196,.18);box-shadow:0 40px 90px -40px rgba(60,20,120,.55),0 10px 30px -18px rgba(60,20,120,.4)}
.light .btn-ghost{color:#1b0f33;background:rgba(255,255,255,.7);border-color:rgba(91,33,196,.22);box-shadow:inset 0 1px 0 #fff,0 12px 30px -16px rgba(60,20,120,.45)}
.light .btn-ghost:hover{background:#fff;box-shadow:inset 0 1px 0 #fff,0 16px 36px -14px rgba(91,33,196,.5)}
@media (max-width:900px){.light .evo-txt hr{margin-inline:auto}}

/* =========================================================
   TEMA CLARO (prueba): toda la página en fondo blanco.
   Para volver al oscuro, quita la clase "theme-light" del <body>.
   Las pantallas (video, chats, Instagram, dashboard, fases, servicios)
   siguen oscuras: se ven como capturas de producto sobre el blanco.
   ========================================================= */
body.theme-light{--bg:#fbf9ff;--bg-2:#f4effd;--panel:#fff;--panel-2:#f6f1ff;--paper:#1b0f33;--hl:#6a2fd0;--muted:#5d5078;--line:rgba(27,15,51,.1);--line-2:rgba(27,15,51,.17);
  color:var(--paper);background:#fbf9ff;
  background-image:radial-gradient(60% 520px at 85% 0,rgba(151,89,255,.14),transparent 70%),radial-gradient(50% 600px at 0% 30%,rgba(255,79,216,.06),transparent 70%)}
.theme-light ::selection{background:rgba(151,89,255,.25);color:#1b0f33}

/* islas oscuras: recuperan sus colores originales */
.theme-light :is(.vsl,.sc-frame,.evo-art,.ccard,.fcard,.editor,.ag-chat,.pub-band,.ofr,.inst-img,.wa-win,.ig,.m-cta,.dx-core){
  --paper:#f5f0ff;--hl:#bd8aff;--muted:#b4a9c6;--line:#ffffff1a;--line-2:#ffffff2e;--bg:#0b0716;color:#f5f0ff}

/* encabezado, textos y piezas comunes */
.theme-light .logo-sub{color:#5d5078}
.theme-light .logo-sub b{color:#6a2fd0}
.theme-light .kicker{color:#6a2fd0}
.theme-light .chip{color:#4b1fa6;background:rgba(151,89,255,.08);border-color:rgba(91,33,196,.2)}
.theme-light .chip .dot{background:#7c3df0}
.theme-light .pillar{color:#3b2c5a}
.theme-light .platforms{color:#2a1d45}
.theme-light .platforms small{color:#5d5078}
.theme-light .link-arrow{text-decoration-color:rgba(91,33,196,.3)}
.theme-light .mq{background:#fff;border-color:rgba(27,15,51,.08)}
.theme-light .mq-track span{color:#2a1d45}
.theme-light .mq-track span i{color:#9759ff}
.theme-light .vsl{box-shadow:0 40px 100px -40px rgba(91,33,196,.55),0 0 0 1px rgba(91,33,196,.12)}
.theme-light .sc-player .sc-time,.theme-light .sc-info .num{color:#5d5078}
.theme-light .sc-btn{color:#1b0f33;border-color:rgba(27,15,51,.15);background:#fff}
.theme-light .sc-btn.main{color:#fff}
.theme-light .flow-bar span{background:#fff}
.theme-light .flow-bar span.on{color:#fff}
.theme-light .cur-pause{background:#fff;color:#1b0f33}
.theme-light .feat{background:#fff;box-shadow:0 8px 20px -14px rgba(60,20,120,.35)}
.theme-light .feat svg{color:#7c3df0}
.theme-light .faq-list summary::after{color:#7c3df0}
.theme-light .closing::before{background:radial-gradient(closest-side,rgba(151,89,255,.16),transparent)}
.theme-light .footer{background:#fff}
.theme-light .wa{box-shadow:0 10px 30px -6px rgba(37,211,102,.5)}
.theme-light .m-cta{background:rgba(255,255,255,.92);border-top-color:rgba(27,15,51,.08)}

/* paneles de cristal blanco */
.theme-light :is(.fun-panel,.rep,.agent,.testi){
  background:linear-gradient(155deg,rgba(255,255,255,.95),rgba(255,255,255,.7));border-color:rgba(91,33,196,.14);
  box-shadow:inset 0 1px 0 #fff,0 30px 70px -40px rgba(60,20,120,.45),0 10px 24px -16px rgba(60,20,120,.25)}
.theme-light .fun-acr span{background:rgba(91,33,196,.08)}
.theme-light .fun-acr span:first-child{color:#fff}
.theme-light .fun-panel .goal{color:var(--tc)}
.theme-light .fun-types span{background:#fff}
.theme-light .fun-kpi i{background:rgba(91,33,196,.08)}
.theme-light .fun-kpi svg{color:var(--tc)}
.theme-light .fun-tabs button.on{color:#fff}
.theme-light .fl .inner{color:#fff}
.theme-light .spout .sales{color:#1b0f33}
.theme-light .rep-bar i{background:rgba(27,15,51,.15)}
.theme-light .rep-bar i:first-child{background:#7c3df0}
.theme-light .rep-side button.on{background:rgba(151,89,255,.12)}
.theme-light .rep-side button b{color:#1b0f33}
.theme-light .rep-side button.on b{color:#6a2fd0}
.theme-light .rep-main .tags span,.theme-light .rep-kpis div,.theme-light .rep-chart{background:rgba(91,33,196,.05)}
.theme-light .rep-kpis em{color:#14915f}
.theme-light .rep-copy{background:rgba(151,89,255,.1)}
.theme-light .ag-top{background:rgba(91,33,196,.05);border-color:rgba(91,33,196,.12)}
.theme-light .ag-top .sw[aria-checked="false"]{background:rgba(27,15,51,.18)}
.theme-light .agent.on .ag-lbl span{color:#14915f}
.theme-light .ag-cap{color:#6a2fd0}
.theme-light .ag-side .sk-row{background:#fff;border-color:rgba(27,15,51,.1)}
.theme-light .ag-side .sk-row i{background:rgba(91,33,196,.08)}
.theme-light .ag-side .sk-row.on{background:rgba(151,89,255,.08);border-color:rgba(124,61,240,.4)}
.theme-light .ag-side .sk-row.on small{color:#6a2fd0}
.theme-light .ag-side .ans.good{color:#0d6b46;background:rgba(65,224,164,.12);border-color:rgba(20,145,95,.35)}
.theme-light .bon-txt .chip svg{color:#6a2fd0}

/* sección del agente IA y "El problema": ya eran claras, se integran con el blanco */
.theme-light .light{background:transparent}
.theme-light .pub{background:radial-gradient(60% 70% at 100% 0%,#f3ecfd 0%,rgba(243,236,253,0) 70%),linear-gradient(#f4eefc,#efe6fb)}

/* luces violetas de la marca: manchas de luz repartidas por toda la página + aurora suave que acompaña el scroll */
body.theme-light{background-image:
  radial-gradient(38% 1100px at 92% 2%,rgba(151,89,255,.24),transparent 70%),
  radial-gradient(34% 900px at 4% 14%,rgba(209,79,224,.13),transparent 70%),
  radial-gradient(40% 1000px at 96% 32%,rgba(124,61,240,.16),transparent 70%),
  radial-gradient(36% 900px at 2% 50%,rgba(151,89,255,.15),transparent 70%),
  radial-gradient(40% 1000px at 98% 68%,rgba(209,79,224,.12),transparent 70%),
  radial-gradient(38% 900px at 6% 84%,rgba(124,61,240,.15),transparent 70%),
  radial-gradient(50% 900px at 60% 100%,rgba(151,89,255,.18),transparent 70%)}
body.theme-light::before{content:"";position:fixed;inset:-20%;z-index:-1;pointer-events:none;
  background:radial-gradient(28% 32% at 22% 28%,rgba(151,89,255,.16),transparent 70%),radial-gradient(24% 30% at 78% 70%,rgba(255,79,216,.1),transparent 70%),radial-gradient(22% 26% at 70% 20%,rgba(124,61,240,.12),transparent 70%);
  filter:blur(20px);animation:lightAurora 22s ease-in-out infinite alternate}
@keyframes lightAurora{0%{transform:translate(0,0) rotate(0)}50%{transform:translate(4%,-3%) rotate(6deg)}100%{transform:translate(-4%,4%) rotate(-5deg)}}
.theme-light .section,.theme-light .showcase,.theme-light .closing{position:relative}
.theme-light .closing::before{background:radial-gradient(closest-side,rgba(151,89,255,.3),transparent)}
@media (prefers-reduced-motion:reduce){body.theme-light::before{animation:none}}
.theme-light .editor{background:linear-gradient(180deg,#1a1131,#0f0a1e);border-color:rgba(255,255,255,.1);box-shadow:0 40px 90px -40px rgba(60,20,120,.6)}
.theme-light .flow-bar span.on{background:#6b2bd9;color:#fff}
.theme-light .ofr .chip{color:#d9c6ff;background:rgba(151,89,255,.1);border-color:#ffffff2e}
.theme-light .sc-btn.main{background:var(--accent);border-color:transparent}
.theme-light .sc-btn:not(.main):hover{background:rgba(151,89,255,.12)}

/* ---------- EMBUDO: minijuego de arrastrar personas ---------- */
.drop{width:22px;height:25px;margin-left:-11px;pointer-events:auto;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.drop::before{content:"";position:absolute;inset:-10px}
.drop.held{cursor:grabbing;z-index:6;transition:transform .15s}
.drop.held svg{filter:drop-shadow(0 0 10px currentColor) drop-shadow(0 6px 8px rgba(0,0,0,.35))}
.fun-hint{position:absolute;left:50%;top:-82px;transform:translateX(-50%);z-index:4;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:7px 14px;border-radius:999px;font-size:.74rem;font-weight:700;color:#4b1fa6;background:rgba(255,255,255,.75);border:1px solid rgba(124,61,240,.25);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 10px 24px -14px rgba(91,33,196,.5)}
.fun-hint svg{width:16px;height:16px;flex:none;animation:hintTap 1.8s ease-in-out infinite}
@keyframes hintTap{50%{transform:translateY(3px) rotate(-8deg)}}
body:not(.theme-light) .fun-hint{color:#e6d6ff;background:rgba(151,89,255,.14);border-color:rgba(189,138,255,.3)}
.fun-plus{position:absolute;left:50%;top:0;white-space:nowrap;font-size:.74rem;font-weight:800;color:#14915f;pointer-events:none}
.funnel{margin-top:40px}
@media (max-width:560px){.fun-hint{font-size:.66rem;white-space:normal;width:max-content;max-width:92%;text-align:center}}
.theme-light .drop svg{filter:drop-shadow(0 0 4px rgba(124,61,240,.6))}

/* ---------- EMBUDO: textos del panel legibles en violeta ---------- */
.theme-light .fun-acr span{background:rgba(124,61,240,.1);color:#3b1690;border:1px solid rgba(124,61,240,.2)}
.theme-light .fun-acr span:first-child{background:var(--tc);color:#fff;border-color:transparent}
.theme-light .fun-types span{background:rgba(124,61,240,.08);border-color:rgba(124,61,240,.28);color:#2a1060}
.theme-light .fun-types span::before{background:var(--tc)}
.theme-light .fun-tabs button{color:#4b3d66;background:#fff}
.theme-light .fun-tabs button.on{background:var(--tc);color:#fff}
.theme-light .fun-acr span:first-child,.theme-light .fun-tabs button.on{background:color-mix(in srgb,var(--tc) 78%,#1b0f33)}

/* ---------- MENSAJES: Instagram + WhatsApp en la misma tarjeta ---------- */
.dm-switch{position:relative;display:grid;grid-template-columns:1fr 1fr;margin:10px 12px 2px;padding:3px;border-radius:12px;background:#1c1c1e;flex:none}
.dm-switch>span{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 0;font-size:.7rem;font-weight:700;color:#a8a8a8;cursor:pointer;transition:color .3s}
.dm-switch>span.on{color:#fff}
.dm-glider{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:9px;background:#3a3a3c;box-shadow:0 2px 8px rgba(0,0,0,.4);transition:transform .45s var(--ease)}
.dm-panes{position:relative;flex:1;min-height:0}
.dm-pane{position:absolute;inset:0;display:flex;flex-direction:column;opacity:0;transform:translateX(14px);transition:opacity .45s,transform .45s var(--ease);pointer-events:none}
.dm-pane.on{opacity:1;transform:none}
.ig-search.sm{margin:0 14px 8px;padding:6px 10px}
.ig-dm .ig-top{padding-top:8px}
.ig-dm .dm{padding:6px 14px}
.ig-dm .dm>i{width:40px;height:40px}
/* bandeja de WhatsApp (modo oscuro) */
.wa-pane{background:#0b141a}
.wa-top{display:flex;align-items:center;gap:12px;padding:10px 14px 6px;flex:none}
.wa-top b{font-size:1.05rem;letter-spacing:-.01em}
.wa-search{display:flex;align-items:center;gap:8px;margin:2px 14px 8px;padding:7px 12px;border-radius:999px;background:#202c33;color:#8696a0;font-size:.68rem;flex:none}
.wa-search svg{width:14px;height:14px}
.wa-chips{display:flex;gap:6px;padding:0 14px 6px;flex:none}
.wa-chips span{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:999px;background:#202c33;color:#8696a0;font-size:.62rem;font-weight:700}
.wa-chips span.on{background:rgba(37,211,102,.18);color:#25d366}
.wa-chips i{font-style:normal;font-size:.56rem;color:#25d366}
.dm.wsp>i{display:grid;place-items:center;font-style:normal;font-size:.62rem;font-weight:800;color:#fff}
.dm.wsp>span{color:#8696a0;font-weight:500}
.dm.wsp>span b{color:#e9edef;font-weight:600}
.dm.wsp em{color:#25d366;gap:5px}
.dm.wsp em::after{display:none}
.dm.wsp em time{font-size:.58rem;font-weight:700}
.dm.wsp em u{text-decoration:none;min-width:17px;height:17px;padding:0 5px;border-radius:999px;background:#25d366;color:#0b141a;display:grid;place-items:center;font-size:.56rem;font-weight:800}
.pcard>.meta .brand+.brand{margin-left:-4px}

/* ---------- PROBLEMA: tarjetas de cristal más marcado ---------- */
.pub-cards{position:relative;isolation:isolate}
.pub-cards::before{content:"";position:absolute;inset:-40px -20px;z-index:-1;pointer-events:none;filter:blur(30px);
  background:radial-gradient(22% 30% at 16% 30%,rgba(151,89,255,.45),transparent 70%),radial-gradient(22% 30% at 52% 70%,rgba(255,79,216,.28),transparent 70%),radial-gradient(22% 30% at 86% 35%,rgba(124,61,240,.4),transparent 70%)}
.pcard{background:linear-gradient(140deg,rgba(255,255,255,.72) 0%,rgba(255,255,255,.22) 40%,rgba(255,255,255,.36) 100%);border:1px solid rgba(255,255,255,.85);
  -webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);
  box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.35),inset 0 -30px 60px -40px rgba(151,89,255,.35),0 30px 60px -30px rgba(60,20,120,.45),0 0 0 1px rgba(124,61,240,.06)}
.wa-top .push{margin-left:auto}
.dm.wsp>i{background:linear-gradient(135deg,var(--a),var(--b))}
.ph{--img:none}

.showcase{overflow:clip}

.sc-head h2{max-width:900px;text-wrap:balance}

/* ---------- FASES: etiqueta de cristal 3D, contador violeta y textos nuevos ---------- */
.sc-tag{position:relative;overflow:hidden;color:#fff;padding:9px 18px;font-size:.66rem;letter-spacing:.1em;
  background:linear-gradient(160deg,#a56bff 0%,#7c3df0 45%,#5b21c4 100%);border:1px solid rgba(255,255,255,.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -3px 6px rgba(40,6,100,.45),0 6px 0 -1px #4a1aa3,0 14px 30px -8px rgba(124,61,240,.7);
  text-shadow:0 1px 2px rgba(40,6,100,.5);transform:translateY(-2px)}
.sc-tag::before{content:"";position:absolute;left:8%;right:8%;top:2px;height:45%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0));pointer-events:none}
.sc-tag::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);background-size:250% 100%;animation:sweep 4s ease-in-out infinite;pointer-events:none}
.sc-time{color:#6a2fd0;font-weight:800;letter-spacing:.04em}
body:not(.theme-light) .sc-time{color:#bd8aff}
.s-ven .sl-note{position:relative;z-index:2;margin-top:10px;font-size:.7rem;line-height:1.4;color:#c9f7e4;opacity:.9}
.s-ven .ttl{padding-bottom:10px}
.s-pos .kpi{margin-top:10px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:.66rem;font-weight:700;color:#b4a9c6;position:relative;z-index:3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
.s-pos .kpi b{font-family:var(--ff-d);font-size:1.1rem;color:#fff}
.s-pos .rank{margin:auto 0 12px}
.s-rem .st.aud{opacity:1;align-items:center}
.s-rem .st.aud span{display:grid;line-height:1.25}
.s-rem .st.aud small{font-size:.58rem;font-weight:600;color:#c9a6ff}
.s-rem .st.aud i{background:rgba(124,61,240,.35);color:#e6d6ff}

/* ---------- BRILLO VIOLETA DETRÁS DE LAS TARJETAS: parecen flotar con luz de sol ---------- */
.theme-light :is(.pcard,.fun-panel,.rep,.agent,.testi){
  box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(124,61,240,.07),
    0 0 40px -6px rgba(151,89,255,.45),0 0 110px 0 rgba(189,138,255,.45),0 0 220px 20px rgba(209,79,224,.14),
    0 34px 60px -34px rgba(60,20,120,.5)}
.theme-light :is(.editor,.vsl,.sc-frame,.evo-art,.ofr,.inst-img){
  box-shadow:0 0 0 1px rgba(255,255,255,.12),
    0 0 50px -4px rgba(151,89,255,.6),0 0 140px 0 rgba(189,138,255,.5),0 0 260px 30px rgba(209,79,224,.16),
    0 44px 80px -40px rgba(40,10,90,.65)}
.theme-light :is(.fcard,.ccard){
  box-shadow:0 0 0 1px rgba(255,255,255,.08),0 0 36px -6px rgba(151,89,255,.5),0 0 90px 0 rgba(189,138,255,.35),0 24px 50px -26px rgba(40,10,90,.6)}
.theme-light .pcard .ill.ig{box-shadow:0 0 30px -6px rgba(151,89,255,.55),0 20px 40px -22px rgba(30,6,70,.8)}

/* ---------- BRILLO VIOLETA DETRÁS DE LAS TARJETAS (tema oscuro): parecen flotar ---------- */
body:not(.theme-light) :is(.fun-panel,.rep,.agent,.testi,.editor,.vsl,.sc-frame,.evo-art,.ofr,.inst-img){
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 0 1px rgba(189,138,255,.1),
    0 0 50px -6px rgba(151,89,255,.55),0 0 140px 0 rgba(124,61,240,.35),0 0 260px 30px rgba(209,79,224,.12),
    0 40px 80px -40px rgba(0,0,0,.8)}
body:not(.theme-light) :is(.fcard,.ccard){box-shadow:0 0 0 1px rgba(189,138,255,.1),0 0 36px -6px rgba(151,89,255,.5),0 0 90px 0 rgba(124,61,240,.3),0 24px 50px -26px rgba(0,0,0,.8)}
body:not(.theme-light) .pcard{box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(124,61,240,.07),0 0 40px -6px rgba(151,89,255,.45),0 0 110px 0 rgba(189,138,255,.45),0 34px 60px -34px rgba(60,20,120,.5)}

/* ---------- "El problema" en fondo oscuro, con tarjetas de cristal oscuro ---------- */
.pub{background:radial-gradient(55% 60% at 100% 0%,rgba(124,61,240,.22),transparent 70%),radial-gradient(50% 55% at 0% 100%,rgba(209,79,224,.12),transparent 70%),var(--bg);color:var(--paper)}
.pub .kicker{color:#b68bea}
.pub .kicker .dot{background:var(--accent)}
.pub-head h2 .hl{color:var(--hl)}
.pub-head p{color:var(--muted)}
.pub-cards::before{opacity:.75}
.pcard{background:linear-gradient(150deg,rgba(255,255,255,.1) 0%,rgba(255,255,255,.03) 45%,rgba(151,89,255,.08) 100%);border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(22px) saturate(160%);backdrop-filter:blur(22px) saturate(160%)}
body:not(.theme-light) .pcard{box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 0 0 1px rgba(189,138,255,.08),0 0 50px -6px rgba(151,89,255,.5),0 0 130px 0 rgba(124,61,240,.32),0 40px 70px -40px rgba(0,0,0,.85)}
.pcard>.meta{color:#c9a6ff}
.pcard h3{color:var(--paper)}
.pcard p{color:var(--muted)}
.pcard .ill.ig{box-shadow:0 0 0 1px rgba(255,255,255,.08),0 20px 40px -22px rgba(0,0,0,.9)}
.pub-band{border-color:rgba(189,138,255,.2)}

/* tarjetas de "El problema": cristal blanco sobre el fondo oscuro, para contraste */
.pcard{background:linear-gradient(145deg,rgba(255,255,255,.96) 0%,rgba(248,243,255,.9) 45%,rgba(236,226,255,.88) 100%);border:1px solid rgba(255,255,255,.9);color:#1b0f33}
body:not(.theme-light) .pcard{box-shadow:inset 0 1px 0 #fff,inset 0 -30px 60px -40px rgba(151,89,255,.35),0 0 0 1px rgba(189,138,255,.15),0 0 50px -4px rgba(151,89,255,.6),0 0 140px 0 rgba(124,61,240,.4),0 40px 70px -40px rgba(0,0,0,.85)}
.pcard>.meta{color:#4b1fa6}
.pcard h3{color:#1b0f33}
.pcard p{color:#4b3d66}

/* ---------- LUCES VIOLETAS EN TODA LA PÁGINA (tema oscuro) ---------- */
body:not(.theme-light){background-image:
  radial-gradient(70% 700px at 88% 270px,rgba(58,25,97,.45),transparent 90%),
  radial-gradient(42% 900px at 4% 16%,rgba(124,61,240,.16),transparent 70%),
  radial-gradient(45% 1000px at 98% 30%,rgba(151,89,255,.14),transparent 70%),
  radial-gradient(40% 900px at 2% 46%,rgba(209,79,224,.1),transparent 70%),
  radial-gradient(45% 1000px at 96% 62%,rgba(124,61,240,.15),transparent 70%),
  radial-gradient(40% 900px at 6% 80%,rgba(151,89,255,.13),transparent 70%),
  radial-gradient(55% 900px at 55% 100%,rgba(124,61,240,.2),transparent 70%)}
body:not(.theme-light)::before{content:"";position:fixed;inset:-20%;z-index:-1;pointer-events:none;
  background:radial-gradient(26% 30% at 20% 30%,rgba(124,61,240,.14),transparent 70%),radial-gradient(22% 28% at 80% 72%,rgba(209,79,224,.08),transparent 70%),radial-gradient(20% 24% at 72% 18%,rgba(151,89,255,.1),transparent 70%);
  filter:blur(24px);animation:lightAurora 24s ease-in-out infinite alternate}
@media (prefers-reduced-motion:reduce){body:not(.theme-light)::before{animation:none}}

/* ---------- MÓVIL: nada puede ser más ancho que la pantalla ---------- */
html,body{overflow-x:clip}
.pub-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.pcard,.pcard .ill,.pcard .ill>*{min-width:0}
:is(.hero,.fun-wrap,.sc-player,.bon-block,.ag-body,.evo,.inst,.faq-wrap,.dx,.db-grid,.db-kpis,.flow-cards,.pub-head,.method-head,.rep-body,.skills)>*{min-width:0}
@media (max-width:900px){.pub-cards{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){.pub-cards::before{inset:-40px 0}}

/* ---------- MÓVIL: ajustes finos ---------- */
/* botón fijo de agendar: aparece solo cuando no hay otro botón de agendar a la vista */
@media (max-width:760px){
  .m-cta{transform:translateY(115%);transition:transform .45s var(--ease)}
  .m-cta.show{transform:none}
}
@media (max-width:700px){
  .db-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .db-kpi{padding:10px 8px}
  .db-kpi small{font-size:.5rem;letter-spacing:.04em}
  .db-kpi b{font-size:1.05rem}
  .db-kpi em{font-size:.55rem;line-height:1.2}
  .rep-side button{white-space:nowrap;flex:none}
  .ag-side .sk-rows{grid-template-columns:1fr 1fr}
  .ag-side .sk-row{padding:9px 10px;font-size:.78rem}
  .ag-side .sk-row small{display:none}
  .ag-side .ans{margin-top:4px}
}
@media (max-width:560px){
  .fcard .gchip{display:none}
  .fcard h3{font-size:1rem}
  .flow-cards{gap:10px}
}
.agent{overflow:clip}

/* =========================================================
   Interactividad: tarjetas de cristal que brillan, IA en 3D y minijuego del embudo
   ========================================================= */
/* ---------- cristal en todas las tarjetas ---------- */
.gcard:not(.evo-msg){position:relative}
:is(.db-kpi,.db-chart,.sc-next,.sk-row,.rep-kpis>div,.dx-list button,.faq-list details){
  background:linear-gradient(155deg,rgba(255,255,255,.08),rgba(255,255,255,.02) 50%,rgba(151,89,255,.06));
  border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 14px 30px -20px rgba(0,0,0,.7)}
.fcard{background:linear-gradient(170deg,rgba(255,255,255,.1),rgba(255,255,255,.025) 45%,rgba(151,89,255,.08));border-color:rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%)}
.ofr{background:linear-gradient(170deg,rgba(124,61,240,.3),rgba(255,255,255,.045) 45%,rgba(151,89,255,.1));
  -webkit-backdrop-filter:blur(24px) saturate(150%);backdrop-filter:blur(24px) saturate(150%)}
.pcard{background:linear-gradient(145deg,rgba(255,255,255,.92) 0%,rgba(248,243,255,.8) 45%,rgba(230,216,255,.76) 100%)}
.faq-list{display:grid;gap:10px;align-content:start}
.faq-list details,.faq-list details:first-child{border-radius:16px;padding:0 16px;transition:border-color .3s}
.faq-list details[open]{border-color:rgba(189,138,255,.4)}

/* reflejo que cruza la tarjeta + borde de cristal */
.gl{position:absolute;inset:0;z-index:8;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.1) 46%,rgba(255,255,255,.28) 50%,rgba(255,255,255,.1) 54%,transparent 60%) no-repeat;
  background-size:300% 100%;background-position:150% 0;animation:glSweep 7s ease-in-out var(--gd,0s) infinite}
.gl::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:linear-gradient(140deg,rgba(255,255,255,.55),rgba(255,255,255,0) 30%,rgba(255,255,255,0) 70%,rgba(189,138,255,.6));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
@keyframes glSweep{0%,62%{background-position:150% 0}100%{background-position:-50% 0}}

/* ---------- EMBUDO: minijuego "Touch me" ---------- */
.drop{width:24px;height:27px;margin-left:-12px;cursor:pointer}
.drop::before{inset:-14px}
.drop.lure svg{animation:lurePulse 1s ease-in-out infinite}
.drop .tm{position:absolute;left:50%;bottom:calc(100% + 7px);transform:translateX(-50%);white-space:nowrap;padding:3px 8px;border-radius:999px;
  font-size:.58rem;font-weight:800;letter-spacing:.04em;color:#fff;background:linear-gradient(160deg,#a56bff,#7c3df0);
  box-shadow:0 6px 16px -6px rgba(124,61,240,.9),inset 0 1px 0 rgba(255,255,255,.4);pointer-events:none;animation:tmBob 1s ease-in-out infinite}
.drop .tm::after{content:"";position:absolute;left:50%;top:100%;margin-left:-4px;border:4px solid transparent;border-top-color:#7c3df0}
.drop.caught{z-index:6;cursor:default}
.drop.caught .tm{display:none}
.drop.caught svg{filter:drop-shadow(0 0 10px currentColor) drop-shadow(0 0 18px rgba(255,255,255,.6))}
.catch-ring{position:absolute;width:44px;height:44px;border-radius:50%;border:2px solid #f0a8ff;box-shadow:0 0 18px #bd8aff,inset 0 0 12px rgba(240,168,255,.5);pointer-events:none;z-index:5}
.fun-hint.win{animation:hintWin .6s var(--ease)}
@keyframes hintWin{40%{transform:translateX(-50%) scale(1.08);box-shadow:0 0 30px -4px rgba(65,224,164,.7)}}
@keyframes tmBob{50%{transform:translateX(-50%) translateY(-3px)}}
@keyframes lurePulse{50%{filter:drop-shadow(0 0 10px #fff) drop-shadow(0 0 4px currentColor)}}

@media (prefers-reduced-motion:reduce){.gl,.drop .tm,.drop.lure svg{animation:none}}

/* =========================================================
   Ajustes: fondo negro, titular con brillo, todo centrado,
   embudo de cristal y solo los colores de la marca
   ========================================================= */
:root{--bg:#000;--bg-2:#05020b;--ok:#c9a6ff}
html{background:#000}
body:not(.theme-light){background-color:#000}
.faq-list summary>.gl{border-radius:16px}
.rep-kpis>div>.gl{border-radius:10px}
.fcard .glare{display:none}

/* ---------- titular: letras blancas con un brillo que parpadea ---------- */
.hero h1{position:relative}
.h1-w{color:#fff;background:linear-gradient(100deg,#fff 0%,#fff 40%,#eadcff 46%,#fff 50%,#d2b6ff 54%,#fff 60%,#fff 100%) 0 0/260% 100% no-repeat;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  animation:h1Shine 5.5s ease-in-out infinite,h1Glow 2.8s ease-in-out infinite}
@keyframes h1Shine{0%,35%{background-position:100% 0}100%{background-position:0 0}}
@keyframes h1Glow{0%,100%{filter:drop-shadow(0 0 0 rgba(255,255,255,0))}50%{filter:drop-shadow(0 0 12px rgba(255,255,255,.5)) drop-shadow(0 0 30px rgba(189,138,255,.45))}}

/* ---------- todas las secciones centradas ---------- */
.pub-head,.method-head{grid-template-columns:1fr;justify-items:center;text-align:center;max-width:820px;margin-inline:auto;gap:18px}
.pub-head p,.method-head p{max-width:60ch;margin-inline:auto}
#embudo .sec-head{justify-items:center;text-align:center;margin-inline:auto}
#embudo .sec-head .sub{max-width:62ch}
.pub-band{flex-direction:column;justify-content:center;text-align:center;gap:22px}
.bon-head{display:grid;justify-items:center;text-align:center;max-width:780px;margin-inline:auto}
.bon-block{grid-template-columns:1fr;justify-items:center;gap:40px}
.bon-txt{display:grid;justify-items:center;text-align:center;max-width:720px}
.bon-txt p{margin-inline:auto}
.feats{grid-template-columns:repeat(2,minmax(0,max-content));justify-content:center;text-align:left}
.bon-block>.rep,.bon-block>.agent{width:100%;max-width:900px}
@media (max-width:1060px) and (min-width:901px){.bon-block{grid-template-columns:1fr}}
@media (max-width:560px){.feats{grid-template-columns:1fr}}

.sc-player{grid-template-columns:1fr;justify-items:center;gap:34px;text-align:center}
.sc-info{display:grid;justify-items:center}
.sc-info h3{min-height:0;margin:10px 0 18px}
.sc-info .desc{margin:0 auto 24px;max-width:52ch}

.evo{grid-template-columns:1fr;grid-template-areas:"h" "art" "t";grid-template-rows:auto;row-gap:40px;justify-items:center;text-align:center}
.evo-h{max-width:820px;margin:0;align-self:auto}
.evo-h span{transform:translateY(8px)}
.evo-h span.on{transform:none}
.evo-art{width:min(460px,100%);max-width:none;text-align:left}
.evo-txt{display:grid;justify-items:center;max-width:620px}
.evo-txt p{margin-inline:auto;max-width:52ch}
.evo-txt hr{margin:26px auto;background:linear-gradient(90deg,transparent,var(--accent),transparent)}

.inst{grid-template-columns:1fr;justify-items:center;text-align:center;gap:38px}
.inst-img{width:min(380px,100%)}
.inst>div:last-child{display:grid;justify-items:center;max-width:680px}
.inst p.t{margin-inline:auto}
.partner{width:fit-content;max-width:100%;margin-inline:auto;text-align:left}

.faq-wrap{grid-template-columns:1fr;justify-items:center;text-align:center;gap:34px}
.faq-list{width:100%;max-width:820px;text-align:left}

/* ---------- FASES (Diagnóstico a Escala) y dashboard: solo violetas ---------- */
.gchip b.w,.gchip b.g,.gchip b.o{background:#e6d6ff;box-shadow:0 0 8px #bd8aff}
.db-band[data-p="3"] .db-bars i{background:linear-gradient(0deg,rgba(151,89,255,.6),#efe6ff)}
.db-line path{stroke:#e6d6ff;filter:drop-shadow(0 0 6px rgba(189,138,255,.8))}
.db-kpi em.up{color:#d9c2ff}

/* ---------- SERVICIOS: escenas en violeta, logos en cristal blanco ---------- */
.g-fun b:nth-child(1){background:rgba(151,89,255,.95)}
.g-fun b:nth-child(2){background:rgba(124,61,240,.95)}
.g-fun b:nth-child(3){background:rgba(201,166,255,.95);color:#2a0f66}
.g-track b:nth-child(2){background:rgba(124,61,240,.9)}
.g-track b:nth-child(3){background:rgba(230,214,255,.9)}
.g-chat b.out{background:rgba(151,89,255,.95);color:#fff}
.g-rec b{background:#e6d6ff;box-shadow:0 0 10px #bd8aff}
.ccard .star{background:linear-gradient(160deg,#fff,#e6d6ff);color:#3b1690}
.cc-scene .blob{opacity:.6}
@media (prefers-reduced-motion:reduce){.h1-w,.fl .shape::after{animation:none}}
.fcard p{opacity:.9}

/* =========================================================
   Lenguaje visual de referencia: textura de puntos, íconos
   ilustrados animados, nodos luminosos y embudo de colores
   ========================================================= */
/* ---------- fondo negro con textura de puntos y luz violeta arriba ---------- */
body:not(.theme-light){background-image:
  radial-gradient(90% 60% at 50% -8%,rgba(88,40,170,.45),transparent 70%),
  radial-gradient(circle,rgba(255,255,255,.038) 1px,transparent 1.5px),
  radial-gradient(42% 900px at 4% 16%,rgba(124,61,240,.16),transparent 70%),
  radial-gradient(45% 1000px at 98% 30%,rgba(151,89,255,.14),transparent 70%),
  radial-gradient(40% 900px at 2% 46%,rgba(209,79,224,.08),transparent 70%),
  radial-gradient(45% 1000px at 96% 62%,rgba(124,61,240,.15),transparent 70%),
  radial-gradient(40% 900px at 6% 80%,rgba(151,89,255,.13),transparent 70%),
  radial-gradient(55% 900px at 55% 100%,rgba(124,61,240,.2),transparent 70%);
  background-size:auto,22px 22px,auto,auto,auto,auto,auto,auto}

/* ---------- barra de progreso al bajar ---------- */
.scroll-prog{position:fixed;left:0;right:0;top:0;height:3px;z-index:200;pointer-events:none}
.scroll-prog i{display:block;height:100%;transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,#6c35cf,#a878ff 70%,#e9dcff);box-shadow:0 0 12px rgba(168,120,255,.8)}

/* ---------- FASES: escenario con puntos e ilustraciones animadas ---------- */
.fcard .ill{filter:none;
  background:radial-gradient(circle,rgba(255,255,255,.045) 1px,transparent 1.5px) 0 0/14px 14px,#0c0718;border:1px solid rgba(255,255,255,.05)}
.fcard .ill::before{inset:-10%;z-index:0;background:radial-gradient(closest-side,rgba(151,89,255,.4),rgba(151,89,255,.08) 60%,transparent);
  mask-image:none;-webkit-mask-image:none;opacity:.35;transition:opacity .6s}
.fcard.on .ill::before,.fcard.hov .ill::before{opacity:1}
.fcard .pic{position:relative;z-index:1;width:132px;height:132px;overflow:visible;opacity:.5;
  transform:translate3d(var(--tx,0),var(--ty,0),0);transition:opacity .5s,transform .25s ease-out,filter .5s}
.fcard.on .pic,.fcard.hov .pic{opacity:1;filter:drop-shadow(0 10px 24px rgba(151,89,255,.45))}
.flow-cards.has-hov .fcard:not(.hov) .pic{opacity:.5;filter:none}
.flow-cards.has-hov .fcard:not(.hov) .ill::before{opacity:.35}
.pic *{transform-box:fill-box}
/* en reposo cada ilustración se ve completa; al activarse se anima */
.pic .a-draw{stroke-dasharray:1;stroke-dashoffset:0}
.pic .a-leak .ring{transform-origin:center}
:is(.fcard.on,.fcard.hov) .pic .a-draw{animation:picDraw 2.6s var(--ease) infinite}
:is(.fcard.on,.fcard.hov) .pic .a-leak .ring{animation:picRing 1.6s ease-out var(--d,0s) infinite}
:is(.fcard.on,.fcard.hov) .pic .a-lens{animation:picLens 3.2s ease-in-out infinite}
:is(.fcard.on,.fcard.hov) .pic .a-tier{animation:picTier 2.8s var(--ease) var(--d,0s) infinite;transform-origin:center}
:is(.fcard.on,.fcard.hov) .pic .a-route{animation:picDash .9s linear infinite}
:is(.fcard.on,.fcard.hov) .pic .a-goal{animation:picPop 2.8s var(--ease) .8s infinite;transform-origin:center}
:is(.fcard.on,.fcard.hov) .pic .a-ok{animation:picPop 2.8s var(--ease) 1s infinite;transform-origin:center}
:is(.fcard.on,.fcard.hov) .pic .a-ad{animation:picGlow 2.4s ease-in-out infinite}
:is(.fcard.on,.fcard.hov) .pic .a-play{animation:picPulse 2.4s ease-in-out infinite;transform-origin:center}
:is(.fcard.on,.fcard.hov) .pic .a-msg{animation:picMsg 3s var(--ease) var(--d,0s) infinite;transform-origin:0% 100%}
:is(.fcard.on,.fcard.hov) .pic .a-bar{animation:picBar 2.8s var(--ease) var(--d,0s) infinite;transform-origin:50% 100%}
:is(.fcard.on,.fcard.hov) .pic .a-head{animation:picFade 2.8s var(--ease) infinite}
:is(.fcard.on,.fcard.hov) .pic .a-star{animation:picTwinkle 2s ease-in-out var(--d,0s) infinite;transform-origin:center}
@keyframes picDraw{0%{stroke-dashoffset:1}45%,100%{stroke-dashoffset:0}}
@keyframes picRing{0%{transform:scale(1);opacity:.9}100%{transform:scale(3);opacity:0}}
@keyframes picLens{0%,100%{transform:translate(-34px,-6px)}50%{transform:translate(0,0)}}
@keyframes picTier{0%{transform:translateY(-8px);opacity:0}25%,85%{transform:none;opacity:1}100%{opacity:1}}
@keyframes picDash{to{stroke-dashoffset:-16}}
@keyframes picPop{0%,15%{transform:scale(0);opacity:0}30%{transform:scale(1.15);opacity:1}40%,100%{transform:scale(1);opacity:1}}
@keyframes picGlow{50%{filter:brightness(1.3)}}
@keyframes picPulse{50%{transform:scale(1.15)}}
@keyframes picMsg{0%,10%{transform:scale(.4) translateY(6px);opacity:0}28%{transform:scale(1.05);opacity:1}38%,88%{transform:none;opacity:1}100%{transform:none;opacity:0}}
@keyframes picBar{0%{transform:scaleY(.15)}35%,100%{transform:none}}
@keyframes picFade{0%,30%{opacity:0}45%,100%{opacity:1}}
@keyframes picTwinkle{0%,100%{transform:scale(.5) rotate(0);opacity:.3}50%{transform:scale(1.15) rotate(45deg);opacity:1}}

/* ---------- línea de pasos con nodos luminosos ---------- */
.flow-bar::before{height:4px;margin-top:-1px;border-radius:99px;background:rgba(255,255,255,.07)}
.flow-bar .fill{height:4px;margin-top:-1px;border-radius:99px;background:linear-gradient(90deg,#6c35cf,#a878ff 70%,#e9dcff);box-shadow:0 0 10px rgba(168,120,255,.65)}
.flow-bar span{min-width:40px;text-align:center;padding:6px 10px;font-size:.66rem;letter-spacing:.08em;color:#c7a7ff;background:#130c24;border-color:rgba(199,167,255,.3)}
.flow-bar span.on{color:#fff;background:linear-gradient(120deg,#a466f7,#6b31c6);border-color:rgba(217,194,255,.4);
  box-shadow:0 0 0 4px rgba(151,89,255,.14),0 0 24px rgba(151,89,255,.65)}

@media (prefers-reduced-motion:reduce){.pic *{animation:none!important}}

/* ---------- EMBUDO: diseño original (violeta, morado y verde) con personas blancas que brillan ---------- */
.spout .sales b,.spout .sales .cnt{color:#41e0a4}
@keyframes salesBump{40%{transform:scale(1.08);box-shadow:0 0 24px -2px #41e0a4}}
.fun-plus{color:#8ef0c9}
.drop{color:#fff}
.drop svg{filter:drop-shadow(0 0 4px #fff) drop-shadow(0 0 10px rgba(255,255,255,.75)) drop-shadow(0 0 18px rgba(201,166,255,.6));animation:dropShine 1.6s ease-in-out infinite}
.drop:nth-child(3n) svg{animation-delay:-.5s}.drop:nth-child(3n+1) svg{animation-delay:-1s}
@keyframes dropShine{50%{filter:drop-shadow(0 0 6px #fff) drop-shadow(0 0 16px rgba(255,255,255,.95)) drop-shadow(0 0 26px rgba(201,166,255,.8))}}
.drop.lure svg,.drop.caught svg{animation:dropShine .8s ease-in-out infinite}
.catch-ring{border-color:#fff;box-shadow:0 0 18px rgba(255,255,255,.9),inset 0 0 12px rgba(255,255,255,.5)}
@media (prefers-reduced-motion:reduce){.drop svg{animation:none}}

/* ---------- EVO: etiqueta original y acentos verdes del agente ---------- */
.evo-tag{position:absolute;top:16px;left:16px;z-index:3;display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:999px;font-size:.62rem;font-weight:800;letter-spacing:.1em;background:rgba(9,6,19,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line-2);transition:background .5s,border-color .5s}
.evo-tag i{width:7px;height:7px;border-radius:50%;background:var(--warn);box-shadow:0 0 10px var(--warn);transition:.5s}
.evo-art.is-ai .evo-tag{background:rgba(124,61,240,.88);border-color:transparent}
.evo-art.is-ai .evo-tag i{background:var(--ok);box-shadow:0 0 10px var(--ok)}
.evo-art.is-ai .evo-msg{border-color:rgba(65,224,164,.45)}
.evo-art.is-ai .evo-msg .ic{background:rgba(65,224,164,.15);color:#41e0a4}
.evo-art.is-ai .evo-tag i{background:#41e0a4;box-shadow:0 0 10px #41e0a4}

/* ---------- TÍTULOS: cada frase en una sola línea en computadora ---------- */
.h2{font-size:clamp(1.75rem,3.3vw,2.7rem);text-wrap:balance}
.pub-head,.method-head,.bon-head,#embudo .sec-head,.cur-head{max-width:1160px}
#embudo .sec-head{max-width:1160px!important}
.sc-head h2,.evo-h{max-width:1160px}
.evo-h{font-size:clamp(1.75rem,3.3vw,2.7rem)}
.sc-ctrls{display:none}

/* ---------- CINTA DE SERVICIOS: solo texto con íconos, sin recuadro ---------- */
.mq{border-block:0;background:none;padding:20px 0}
.mq-track span{display:inline-flex;align-items:center;gap:12px;padding-right:46px}
.mq-track .mi{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:10px;color:#e6d6ff;
  background:linear-gradient(150deg,rgba(166,107,255,.35),rgba(91,40,179,.25));border:1px solid rgba(199,167,255,.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 6px 16px -8px rgba(151,89,255,.8)}
.mq-track .mi svg{width:18px;height:18px}
.pub{background:none}

/* ---------- BOTONES DE ACCIÓN: cristal real (translúcido, reflejo y destello) ---------- */
.btn,.btn-ghost{color:#fff;text-shadow:0 1px 10px rgba(40,10,90,.55);
  background:linear-gradient(160deg,rgba(196,160,255,.34),rgba(124,61,240,.16) 52%,rgba(91,33,196,.3));
  border:1px solid rgba(255,255,255,.26);border-top-color:rgba(255,255,255,.62);border-bottom-color:rgba(201,166,255,.4);
  -webkit-backdrop-filter:blur(18px) saturate(180%) brightness(1.08);backdrop-filter:blur(18px) saturate(180%) brightness(1.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 0 22px rgba(201,166,255,.28),inset 0 -12px 22px -10px rgba(151,89,255,.55),
    0 14px 36px -14px rgba(151,89,255,.9),0 2px 8px rgba(0,0,0,.35)}
/* reflejo curvo en la mitad superior, como en un vidrio */
.btn::before{content:"";position:absolute;left:2px;right:2px;top:1px;height:52%;z-index:-1;pointer-events:none;
  border-radius:10px 10px 50% 50%/10px 10px 12px 12px;background:linear-gradient(180deg,rgba(255,255,255,.4),rgba(255,255,255,.06))}
/* destello que cruza el cristal */
.btn::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.08) 44%,rgba(255,255,255,.5) 50%,rgba(255,255,255,.08) 56%,transparent 65%);
  background-size:250% 100%;animation:sweep 4.5s ease-in-out infinite}
.btn:hover,.btn-ghost:hover{transform:translateY(-2px);
  background:linear-gradient(160deg,rgba(210,180,255,.44),rgba(124,61,240,.24) 52%,rgba(91,33,196,.38));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 0 26px rgba(201,166,255,.38),inset 0 -12px 22px -10px rgba(151,89,255,.65),
    0 18px 44px -12px rgba(151,89,255,1),0 2px 8px rgba(0,0,0,.35)}
.btn:active{transform:translateY(0) scale(.98)}
.btn:focus-visible{outline:2px solid #e6d6ff;outline-offset:3px}
@media (prefers-reduced-motion:reduce){.btn::after{animation:none}}

/* ---------- DIAGNÓSTICO: precio en tarjeta de cristal, sin círculo ---------- */
.price{display:grid;justify-items:center;gap:18px;max-width:560px;margin:44px auto 0;padding:24px 26px 20px;border-radius:22px;
  background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.02) 55%,rgba(151,89,255,.08));border:1px solid rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(16px) saturate(150%);backdrop-filter:blur(16px) saturate(150%);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 24px 50px -30px rgba(151,89,255,.7)}
.price .ring,.price .from{display:none}
.pc-chip{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;font-size:.74rem;font-weight:700;letter-spacing:.02em;color:#e6d6ff;
  background:rgba(151,89,255,.14);border:1px solid rgba(189,138,255,.3)}
.pc-chip svg{width:15px;height:15px}
.pc-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;width:100%}
.pc-col{display:grid;gap:6px;justify-items:center}
.pc-col small{font-size:.66rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.pc-col.was s{font-family:var(--ff-d);font-weight:700;font-size:1.6rem;color:rgba(245,240,255,.45);text-decoration-thickness:2px;text-decoration-color:rgba(189,138,255,.8)}
.pc-arrow{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;color:#d9c2ff;background:rgba(151,89,255,.16);border:1px solid rgba(189,138,255,.3)}
.pc-arrow svg{width:18px;height:18px}
.pc-amt{display:flex;align-items:flex-start;gap:6px}
.price .cur{font-family:var(--ff-d);font-weight:700;font-size:1.1rem;color:var(--hl);margin-top:10px}
.price .val{font-family:var(--ff-d);font-weight:800;font-size:clamp(3.2rem,7vw,4.4rem);line-height:1;letter-spacing:-.04em;color:#fff;min-width:2.2ch;text-align:center}
.price.done .val{text-shadow:0 0 28px rgba(189,138,255,.7)}
.pc-bar{width:100%;height:4px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}
.pc-bar i{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));border-radius:inherit;
  background:linear-gradient(90deg,#6c35cf,#a878ff 70%,#e9dcff);box-shadow:0 0 10px rgba(168,120,255,.7)}
.price .pay{margin:0}
@media (max-width:560px){.price{margin-top:34px;padding:20px 16px 16px}.pc-row{gap:10px}.pc-col.was s{font-size:1.2rem}.pc-col small{font-size:.56rem;letter-spacing:.06em}}
@media (max-width:560px){.price{margin-top:34px}}

/* ---------- REVISIÓN 360°: íconos en cada punto ---------- */
.dxi{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:11px;color:#e6d6ff;
  background:linear-gradient(150deg,rgba(166,107,255,.32),rgba(91,40,179,.2));border:1px solid rgba(199,167,255,.3);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22);transition:background .35s,box-shadow .35s,color .35s}
.dxi svg{width:19px;height:19px}
.dx-list li.on .dxi,.dx-list li.cur .dxi{color:#fff;background:linear-gradient(150deg,#a466f7,#6b31c6);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 0 18px -4px rgba(151,89,255,.9)}

/* ---------- PRECIO: tarjeta de cristal semitransparente con reflejo y destello ---------- */
.price{position:relative;overflow:hidden;isolation:isolate;border-radius:24px;
  background:radial-gradient(60% 80% at 12% 8%,rgba(166,107,255,.38),transparent 60%),radial-gradient(55% 70% at 92% 100%,rgba(201,166,255,.22),transparent 65%),
    linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.04) 45%,rgba(189,138,255,.1));
  border:1px solid rgba(255,255,255,.24);border-top-color:rgba(255,255,255,.55);
  -webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 0 40px rgba(201,166,255,.14),inset 0 -20px 40px -24px rgba(151,89,255,.6),
    0 30px 60px -30px rgba(151,89,255,.9),0 0 80px -30px rgba(189,138,255,.6)}
.price::before{content:"";position:absolute;left:2px;right:2px;top:1px;height:46%;z-index:-1;pointer-events:none;
  border-radius:22px 22px 50% 50%/22px 22px 26px 26px;background:linear-gradient(180deg,rgba(255,255,255,.2),rgba(255,255,255,0))}
.price::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(110deg,transparent 38%,rgba(255,255,255,.06) 45%,rgba(255,255,255,.28) 50%,rgba(255,255,255,.06) 55%,transparent 62%);
  background-size:260% 100%;animation:sweep 5.5s ease-in-out infinite}
.pc-chip{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.pc-arrow{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.pc-col small{color:#d9cdee}
.pc-bar{background:rgba(255,255,255,.12)}
@media (prefers-reduced-motion:reduce){.price::after{animation:none}}

/* ---------- SERVICIOS: íconos con el color de cada plataforma ---------- */
.glass .gh i.pf-rec{background:linear-gradient(150deg,#ff5a6e,#e0233c);box-shadow:0 4px 12px -4px rgba(255,48,64,.8)}
.glass .gh i.pf-edit{background:#00005b;box-shadow:inset 0 0 0 1.5px #9999ff}
.glass .gh i.pf-edit svg{color:#9999ff}
.glass .gh i.brand{box-shadow:0 4px 12px -4px rgba(0,0,0,.6)}
.g-rec b{background:#ff3d5a;box-shadow:0 0 10px #ff3d5a}

/* ---------- SERVICIOS: flechas y pausa en cristal ---------- */
.cur-ctrls{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:-30px;position:relative}
.cur-ctrls .cur-pause{margin:0;color:#fff;background:linear-gradient(160deg,rgba(196,160,255,.22),rgba(124,61,240,.1));border:1px solid rgba(255,255,255,.22);border-top-color:rgba(255,255,255,.5);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 10px 24px -12px rgba(151,89,255,.8);transition:background .2s,transform .2s}
.cur-ctrls .cur-pause:hover{background:linear-gradient(160deg,rgba(210,180,255,.34),rgba(124,61,240,.2));transform:translateY(-2px)}
.cur-ctrls .cur-pause svg{width:18px;height:18px}
.cur-rail{touch-action:pan-y;cursor:grab}
.cur-rail img{-webkit-user-drag:none;user-select:none}

/* ---------- SERVICIOS: color en cada ícono según lo que representa ---------- */
.glass .gh i.pf-money{background:linear-gradient(150deg,#34d399,#059669);box-shadow:0 4px 12px -4px rgba(16,185,129,.85)}
.glass .gh i.pf-msg{background:linear-gradient(45deg,#0099ff,#a033ff 60%,#ff5280);box-shadow:0 4px 12px -4px rgba(160,51,255,.85)}
.glass .gh i.pf-goal{background:linear-gradient(150deg,#ff7a45,#e11d48);box-shadow:0 4px 12px -4px rgba(225,29,72,.85)}
.glass .gh i.pf-learn{background:linear-gradient(150deg,#fbbf24,#d97706);box-shadow:0 4px 12px -4px rgba(217,119,6,.85)}
.g-loop span i.pf-saw{background:linear-gradient(150deg,#38bdf8,#2563eb);box-shadow:0 4px 10px -4px rgba(37,99,235,.9)}
.g-loop span i.pf-left{background:linear-gradient(150deg,#fb7185,#e11d48);box-shadow:0 4px 10px -4px rgba(225,29,72,.9)}
.g-loop span i.pf-back{background:linear-gradient(150deg,#34d399,#059669);box-shadow:0 4px 10px -4px rgba(5,150,105,.9)}
.g-line path{stroke:#6ee7b7;filter:drop-shadow(0 0 6px rgba(52,211,153,.7))}