/* MiPáginaYa · capa premium de movimiento.
   Una sola curva (expo-out), tres duraciones y solo transform/opacity
   para que todo corra en la GPU, también en celulares modestos. */
:root{--ease-out:cubic-bezier(.16,1,.3,1);--ease-pop:cubic-bezier(.34,1.56,.64,1)}

/* Evita el parpadeo antes de que entre la portada */
.motion-pre .hero-copy,.motion-pre .hero-art,.motion-pre .site-header .brand,.motion-pre .site-header nav,.motion-pre .menu-toggle,.motion-pre .ticker,.motion-pre .guide-launch{opacity:0}

/* Títulos que suben palabra por palabra desde una máscara */
.hero h1 .line{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.hero h1 .line>span{display:inline-block;will-change:transform}
.w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
.w>span{display:inline-block;transform-origin:0 100%}

/* Logo: el rayo es un dibujo, igual en todos los equipos */
.brand-ya{display:inline-flex;align-items:center;gap:2px}
.brand-ya svg{width:.36em;height:.56em;fill:var(--purple)}
.dark-brand .tag svg{fill:var(--lime)}

/* Halo sin filtro de desenfoque animado (era lo más pesado en móvil) */
.brand-halo{filter:none;background:none;animation:none!important;inset:6% 2%}
.brand-halo:before{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 50% 50%,#7a3cffb3 0,#6c2bff55 38%,#6c2bff00 70%)}
@media(prefers-reduced-motion:no-preference){.brand-halo:before{animation:halo-breathe 7s ease-in-out infinite}}
@keyframes halo-breathe{50%{opacity:.6;transform:scale(.92)}}

/* Cinta continua: dos copias del texto, recorrido exacto de la mitad */
.ticker>div{animation-name:ticker-loop;animation-duration:32s}
@keyframes ticker-loop{to{transform:translateX(-50%)}}

/* Nada se mueve fuera de pantalla */
.hero.is-offscreen *,.hero.is-offscreen *:before,.ticker.is-offscreen>div,.contact-section.is-offscreen:before{animation-play-state:paused!important}

/* Barra de progreso por GPU */
.scroll-progress{width:100%!important;transform:scaleX(0);transform-origin:0 50%;background:linear-gradient(90deg,var(--purple),#a46bff 70%,var(--lime));will-change:transform}

/* Tarjetas: elevación suave al pasar el mouse */
@media(hover:hover) and (pointer:fine){
 .service{transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out)}
 .service:hover{transform:translateY(-8px);box-shadow:0 24px 50px #3a157026}
 .service-icon img{transition:transform .6s var(--ease-pop)}
 .service:hover .service-icon img{transform:translateY(-6px) rotate(-6deg) scale(1.06)}
 .price-card{transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out)}
 .price-card:hover{transform:translateY(-8px);box-shadow:0 28px 60px #4a1a9a24}
 .case-art{transition:transform .7s var(--ease-out)}
 .case-art:hover{transform:rotate(-1deg) translateY(-4px)}
 .button{transition:transform .35s var(--ease-pop),background .25s,box-shadow .35s}
 .button.primary:hover{box-shadow:0 10px 26px #b6f02e55}
}

/* Planes */
.price b{font-weight:inherit;font-variant-numeric:tabular-nums;display:inline-block;min-width:5.2ch}
.service,.price-card{contain:layout paint}
.price{font-variant-numeric:tabular-nums}
@media(min-width:761px){#planes{overflow:visible}}
.featured:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 35%,#ffffff2e 50%,transparent 65%);transform:translateX(-120%);pointer-events:none}
@media(prefers-reduced-motion:no-preference){.featured.is-lit:after{animation:card-shine 6s var(--ease-out) infinite}}
@keyframes card-shine{0%,55%{transform:translateX(-120%)}85%,100%{transform:translateX(120%)}}
.plan-dots{display:none}
@media(max-width:760px){
 .plan-dots{display:flex;justify-content:center;gap:6px;margin-top:6px}
 .plan-dots i{display:block;width:6px;height:6px;border-radius:6px;background:#d6c6ee;transition:width .5s var(--ease-out),background .4s}
 .plan-dots i.on{width:22px;background:var(--purple)}
 .plan-hint{margin-top:8px}
}

/* Construcción en vivo: cada pieza entra y empuja a la siguiente */
.build-top{display:flex;align-items:center;gap:12px}
.build-meter{flex:1;max-width:150px;height:3px;border-radius:3px;background:#e2d5f3;overflow:hidden}
.build-meter i{display:block;height:100%;background:linear-gradient(90deg,var(--purple),#a46bff);transform:scaleX(0);transform-origin:0 50%}
.build-part{transition:opacity .7s var(--ease-out),transform .9s var(--ease-out),visibility 0s}
.build-part.is-hidden{opacity:0;transform:translateY(18px) scale(.96);transition-duration:.35s,.35s,0s;transition-delay:0s,0s,.35s}
.build-hero>div:first-child,.build-hero .mini-photo{transition:transform .9s var(--ease-out) .12s,opacity .7s .12s}
.build-hero.is-hidden>div:first-child{transform:translateX(-26px);opacity:0}
.build-hero.is-hidden .mini-photo{transform:translateX(26px) scale(.9);opacity:0}
.build-cards.is-hidden{opacity:1;transform:none}
.build-cards>div{transition:transform .8s var(--ease-pop),opacity .6s var(--ease-out)}
.build-cards>div:nth-child(2){transition-delay:.12s}
.build-cards>div:nth-child(3){transition-delay:.24s}
.build-cards.is-hidden>div{opacity:0;transform:translateY(24px) rotate(-3deg) scale(.88);transition-delay:0s}
.build-published{transition:transform .8s var(--ease-pop),opacity .5s var(--ease-out),visibility 0s}
.build-published.is-hidden{transform:translateY(34px) scale(.8)}
.js .build-step.active{animation:none}
.build-caption{display:inline-block}

/* Preguntas: la respuesta se despliega en vez de aparecer de golpe */
.faq details p{overflow:hidden}
.faq details{transition:background .35s var(--ease-out),border-color .35s}
.faq summary:after{transition:transform .45s var(--ease-pop)}
.faq details[open] summary:after{content:'+';transform:rotate(135deg)}

/* Contacto: brillo ambiental lento */
.contact-section{position:relative;isolation:isolate}
.contact-section:before{content:'';position:absolute;width:70vmax;height:70vmax;left:50%;top:60%;margin:-35vmax 0 0 -35vmax;border-radius:50%;background:radial-gradient(circle,#7b3dff44 0,#7b3dff00 65%);z-index:-1;pointer-events:none}
@media(prefers-reduced-motion:no-preference){.contact-section:before{animation:glow-drift 14s ease-in-out infinite}}
@keyframes glow-drift{50%{transform:translate(8%,-6%) scale(1.1)}}

/* Guía Ya */
.avatar-speech{transition:none}
.guide-nudge{animation:none}

/* Móvil: menos costo de pintura */
@media(max-width:760px){
 .site-header.scrolled{backdrop-filter:none;background:#fffffff5}
}
@media(prefers-reduced-motion:reduce){.scroll-progress{transition:none}.faq summary:after{transition:none}}

/* Mientras una sección entra, GSAP es el único dueño del movimiento */
.is-entering :is(.service,.price-card,.case-art,.button,.link-button,.avatar-speech,.faq details),:is(.service,.price-card).is-entering{transition:none!important}
.contact-direct{justify-content:center}
.contact-inner h2>.w{color:#fff}
@media(min-width:761px){footer{padding-right:150px}}