/* BizStrat Studio · movimiento del sitio (v10, 2 nov 2026). Solo en el sitio publicado.
   Todo lo que se oculta para animarse depende de html.m-on: sin JavaScript o con
   "reducir movimiento" la página se ve completa y quieta. */

/* Lenis (scroll suave en escritorio) */
html.lenis,html.lenis body{height:auto;}
html.lenis{scroll-behavior:auto;}
.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip;}
.lenis.lenis-smooth iframe{pointer-events:none;}

/* ── el hilo conductor ── */
.thread{position:absolute;left:0;top:0;z-index:1;pointer-events:none;overflow:visible;}
.thread .tl,.thread .br,.thread .dr{fill:none;stroke:#FF2566;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.thread .node{stroke:#cfcfcf;stroke-width:1.5;transition:fill .45s ease,stroke .45s ease;}
.thread .node.on{fill:#FF2566 !important;stroke:#FF2566;}
.thread .node.sm{stroke-width:1.2;}
.thread .tip{transition:opacity .4s ease;}
.thread .tip-halo{fill:rgba(255,37,102,.12);}
.thread .tip-bolt{filter:drop-shadow(0 0 5px rgba(255,37,102,.55));}
@media (max-width:640px){.thread .tl,.thread .br,.thread .dr{stroke-width:1.4;}}

/* ── revelados ── */
.m-on .rv{opacity:0;transform:translateY(24px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s);}
.m-on .rv.in{opacity:1;transform:none;}
.m-on .row-item.rv{transform:translateX(-20px);}
.m-on .row-item.rv.in{transform:none;}
.m-on .row-item.rv > img{opacity:0;transform:rotate(-120deg) scale(.3);transition:transform .9s cubic-bezier(.2,.8,.2,1.25) calc(var(--d,0s) + .15s),opacity .5s ease calc(var(--d,0s) + .15s);}
.m-on .row-item.rv.in > img{opacity:1;transform:none;}
.m-on .card.rv{transform:translateY(40px) scale(.98);}
.m-on .card.rv.in{transform:none;}
.m-on .card.rv.in:hover{transform:translateY(-3px);}
.m-on .work-card.rv{transform:perspective(1200px) translateY(56px) rotateX(9deg);transform-origin:50% 100%;}
.m-on .work-card.rv.in{transform:none;}
/* la franja «La próxima puede ser la tuya» sube después de las tres webs */
.m-on .work-next.rv{transform:translateY(48px) scale(.985);transform-origin:50% 100%;}
.m-on .work-next.rv.in{transform:none;}

/* titulares que suben palabra por palabra */
.m-on .split{visibility:hidden;}
.m-on .split.ready{visibility:visible;}
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding:.1em .05em .14em;margin:-.1em -.05em -.14em;}
.split .wi{display:inline-block;}
.m-on .split .wi{transform:translate3d(0,140%,0);transition:transform 1.05s cubic-bezier(.16,.84,.26,1);transition-delay:calc(var(--i,0) * 55ms + var(--d,0s));}
.m-on .split.in .wi{transform:none;}
/* golpes: entran en seco («Tú ya lo eres.», «Que se note.»): sin subir, con un asentamiento corto */
.m-on .split .hit .w{overflow:visible;}
.m-on .split .hit .wi{opacity:0;transform:scale(1.14);filter:blur(10px);transition:opacity .12s linear,transform .6s cubic-bezier(.16,.9,.25,1),filter .45s ease;transition-delay:calc(var(--hd,.8s) + (var(--i,4) - 4) * 38ms);}
.m-on .split.in .hit .wi{opacity:1;transform:none;filter:none;}

/* portada con profundidad (el titular va un poco más lento que el scroll) */
.m-on .hero-title{transform:translate3d(0,var(--hy,0px),0);will-change:transform;}

/* entrada de la portada */
.m-on .hero-pill{opacity:0;transform:translateY(12px);transition:opacity .8s ease .05s,transform .9s cubic-bezier(.2,.7,.2,1) .05s;}
.m-on.hero-in .hero-pill{opacity:1;transform:none;}
.m-on .hero-facts{position:relative;border-top-color:transparent !important;}
.m-on .hero-facts::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:rgba(17,17,17,.12);transform:scaleX(0);transform-origin:left;transition:transform 1.5s cubic-bezier(.65,0,.2,1) 1.3s;}
.m-on.hero-in .hero-facts::before{transform:none;}

/* el dolor: gris hasta que lo lees; «Y nada.» cae como un golpe */
.m-on .scrub{visibility:hidden;}
.m-on .scrub.ready{visibility:visible;}
.m-on .scrub .sw{color:#d3d3d3;transition:color .45s ease;}
.m-on .scrub .sw.on{color:inherit;}
.m-on .scrub b{display:inline-block;}
.m-on .scrub b.hit-on{animation:bz-thud .65s cubic-bezier(.16,.9,.25,1);}
@keyframes bz-thud{0%{transform:scale(1.22);filter:blur(5px)}100%{transform:none;filter:none}}

/* «tunombre.com» se escribe; cursor fucsia */
.m-on .typer.typing::after{content:"";display:inline-block;width:1.5px;height:12px;margin-left:2px;vertical-align:-2px;background:#FF2566;animation:bz-caret 1s steps(1) infinite;}
.m-on .typer.typed::after{animation:bz-caret 1s steps(1) 3 forwards;}
@keyframes bz-caret{0%,49%{opacity:1}50%,100%{opacity:0}}

/* las marcas de la bio se tiñen de fucsia, de izquierda a derecha */
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .m-on .brand{color:transparent;background-image:linear-gradient(90deg,#FF2566 0 50%,#111111 50% 100%);background-size:200% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;transition:background-position 1.1s cubic-bezier(.65,0,.25,1) var(--bd,0s);}
  .m-on .rv.in .brand{background-position:0 0;}
}

/* la oferta: el botón late dos veces cuando aparece (el clic que sí llega) */
.ping{position:relative;}
.m-on .ping::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;}
.m-on .rv.in .ping::after{animation:bz-ping 1.7s cubic-bezier(.2,.6,.3,1) 1.4s 2;}
@keyframes bz-ping{0%{box-shadow:0 0 0 0 rgba(255,37,102,.55)}75%,100%{box-shadow:0 0 0 18px rgba(255,37,102,0)}}

/* preguntas: el círculo de WhatsApp aparece con un pequeño salto */
.m-on .rv.in .faq-wa{animation:bz-pop-in .8s cubic-bezier(.3,1.7,.5,1) calc(var(--d,0s) + .35s) backwards;}
@keyframes bz-pop-in{0%{transform:scale(.2);opacity:0}100%{transform:none;opacity:1}}

/* método: los pasos se encienden cuando llega el hilo */
.m-on .step-dot.first{background:#111111;}
.m-on .step.lit .step-dot{background:#FF2566;animation:bz-pop .6s cubic-bezier(.3,1.6,.5,1);}
.m-on .step.lit .step-dot img{filter:brightness(0) invert(1);}
@keyframes bz-pop{0%{transform:scale(1)}45%{transform:scale(1.18)}100%{transform:scale(1)}}

/* trayectoria */
.m-on .tl-item.lit .tl-dot{background:#FF2566;animation:bz-pop .6s cubic-bezier(.3,1.6,.5,1);}
.m-on .tl-item:not(:last-child)::before{transition:background .6s ease;}

/* fotos: cortina + parallax */
.m-on .portrait,.m-on .ph-frame{clip-path:inset(100% 0 0 0 round 18px);transition:clip-path 1.35s cubic-bezier(.7,0,.2,1) calc(var(--d,0s) + .1s);}
.m-on .rv.in .portrait,.m-on .rv.in .ph-frame{clip-path:inset(0 0 0 0 round 18px);}
.m-on .portrait img,.m-on .ph-frame img{transform:translate3d(0,var(--py,0px),0) scale(1.12);will-change:transform;}
.m-on figure.rv{transform:none;}

/* cifras */
.stat-num{font-variant-numeric:tabular-nums;}

/* cierre: el hilo dibuja la nube y cae el rayo */
.end-trace{stroke:none;}
.m-on .end-trace{stroke:#FF2566;stroke-width:15;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1;stroke-dashoffset:1;transition:opacity .8s ease .35s;}
.m-on .end-cloud{fill-opacity:0;transition:fill-opacity .9s ease;}
.m-on .end-bolt{opacity:0;transform:translate3d(0,-620px,0);transition:transform .25s ease-in,opacity .2s ease;}
.m-on .end-logo.done .end-cloud{fill-opacity:1;}
.m-on .end-logo.done .end-trace{opacity:0;}
.m-on .end-logo.done .end-bolt{opacity:1;transform:none;transition:transform .55s cubic-bezier(.35,1.65,.55,1) .15s,opacity .15s ease .15s;}
.end-logo{position:relative;}
.end-logo::after{content:"";position:absolute;left:50%;top:60%;width:160px;height:160px;margin:-80px 0 0 -80px;border-radius:50%;background:radial-gradient(circle,rgba(255,37,102,.55),rgba(255,37,102,0) 65%);opacity:0;transform:scale(.4);pointer-events:none;}
.m-on .end-logo.done::after{animation:bz-flash 1.1s ease-out .3s;}
@keyframes bz-flash{0%{opacity:0;transform:scale(.4)}25%{opacity:1}100%{opacity:0;transform:scale(1.6)}}

/* botón flotante de WhatsApp */
.wa-fab{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:60;width:56px;height:56px;border-radius:50%;background:#FF2566;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px -10px rgba(255,37,102,.7),0 2px 8px rgba(17,17,17,.2);opacity:0;transform:translateY(18px) scale(.85);pointer-events:none;transition:opacity .35s ease,transform .5s cubic-bezier(.2,.8,.2,1.25),background .2s;}
.wa-fab.show{opacity:1;transform:none;pointer-events:auto;}
.wa-fab:hover{background:#e81a59;}
.wa-fab:focus-visible{outline:2px solid #111111;outline-offset:3px;}
.wa-fab svg{width:26px;height:26px;display:block;}
@media (min-width:1081px){.wa-fab{right:calc(28px + env(safe-area-inset-right,0px));bottom:calc(28px + env(safe-area-inset-bottom,0px));}}

@media (prefers-reduced-motion:reduce){
  .wa-fab{transition:none;}
}
