/* Animaciones ImpulsandoT (prueba 22 oct 2026). Tranquilas, en colores de marca. */

/* 1. Entrada del título */
.hero--home .eyebrow,.hero--home .lead,.hero--home .cta-row,.hero--home .microcopy,.hero--home .place{animation:anFade .9s cubic-bezier(.2,.7,.2,1) both}
.hero--home .lead{animation-delay:.45s}.hero--home .cta-row{animation-delay:.6s}.hero--home .microcopy,.hero--home .place{animation-delay:.75s}
.hero--home h1 .ln{display:block;overflow:hidden;padding-bottom:.06em}
.hero--home h1 .ln>span.in{display:inline-block;animation:anUp 1s cubic-bezier(.2,.7,.2,1) both}
.hero--home h1 .ln:nth-child(2)>span.in{animation-delay:.15s}
.hero--home .hero-art{animation:anFade 1.1s .3s cubic-bezier(.2,.7,.2,1) both}
@keyframes anUp{from{transform:translateY(105%)}to{transform:none}}
@keyframes anFade{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* 2. Frase que se ilumina al bajar */
.manifiesto{position:relative;height:170vh;background:linear-gradient(180deg,#fff,var(--fondo-2) 30%,var(--fondo-2) 70%,#fff)}
.mf-sticky{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:0 1.2rem}
.mf-text{font-family:"Amaranth",sans-serif;font-weight:700;font-size:clamp(2rem,6.2vw,4.6rem);line-height:1.12;max-width:15ch;color:var(--azul-noche,#072F5F);margin:.6rem 0 0}
.mf-text .w{opacity:.14;transition:opacity .25s linear,color .25s linear}
.mf-text .w.on{opacity:1}
.mf-text .w.acc{color:var(--azul)}
.mf-impulso{width:clamp(90px,14vw,150px);margin-top:1.4rem;opacity:0;transform:translateY(20px);transition:opacity .6s,transform .6s}
.mf-impulso.on{opacity:1;transform:none}

/* 3. Cinta en movimiento */
.cinta{background:var(--azul-noche,#072F5F);color:#fff;overflow:hidden;padding:.85rem 0;white-space:nowrap}
.cinta-track{display:inline-flex;gap:2.4rem;animation:anMarquee 38s linear infinite;padding-left:2.4rem}
.cinta span{font-family:"Amaranth",sans-serif;font-weight:700;font-size:1.05rem}
.cinta span.k{color:var(--turquesa)}
@keyframes anMarquee{to{transform:translateX(-50%)}}

/* 4. Tarjetas que se apilan */
.tec-stack{display:grid;gap:0;margin:0 0 1.9rem}
.tec-stack .card{position:sticky;top:90px;min-height:250px;display:grid;gap:1rem;align-items:center;box-shadow:0 -10px 30px rgba(7,47,95,.10),var(--sombra);margin-bottom:1.2rem;transform-origin:center top}
.tec-stack .card:nth-child(2){top:110px}.tec-stack .card:nth-child(3){top:130px}
.tec-stack .card img{width:100%;max-width:220px;border-radius:14px;margin:0 auto}
@media(min-width:760px){.tec-stack .card{grid-template-columns:220px 1fr;padding:1.8rem 2rem}.tec-stack .card img{margin:0}}
.tec-stack .card:hover{transform:none}

/* 5. Acercamiento suave de la foto */
.zoomin{overflow:hidden}.zoomin img{transform:scale(var(--z,1.1))}

/* 6. Aparición en cascada */
.cascada>*{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.cascada.vis>*{opacity:1;transform:none}
.cascada.vis>*:nth-child(2){transition-delay:.1s}.cascada.vis>*:nth-child(3){transition-delay:.2s}.cascada.vis>*:nth-child(4){transition-delay:.3s}.cascada.vis>*:nth-child(5){transition-delay:.4s}.cascada.vis>*:nth-child(6){transition-delay:.5s}

/* Botones: brillo suave al pasar */
.btn{transition:transform .2s,box-shadow .2s}.btn:hover{box-shadow:0 10px 24px rgba(7,47,95,.18)}

/* Sin movimiento para quien lo pidió */
@media (prefers-reduced-motion: reduce){
  .hero--home *, .cinta-track{animation:none!important}
  .manifiesto{height:auto}.mf-sticky{position:static;height:auto;padding:4rem 1.2rem}.mf-text .w{opacity:1}.mf-impulso{opacity:1;transform:none}
  .tec-stack .card{position:static}
  .zoomin img{transform:none}
  .cascada>*{opacity:1;transform:none}
}
/* color claro solo para la palabra «mueve» */
.hero--home h1 .ln,.hero--home h1 .in{color:inherit}
.hero--home h1 .in>span.acc{color:#bff0ff}

/* Impulso y títulos más grandes (sugerencia 22 oct) */
.hero--home .hero-art{min-height:360px}
.hero--home .hero-impulso{width:min(88%,420px)}
.hero--home .hero-blob{width:min(100%,460px)}
.hero--home h1{font-size:clamp(2.7rem,9vw,4.8rem);line-height:1.05}
.hero--home .lead{font-size:clamp(1.08rem,2.4vw,1.3rem)}
h2{font-size:clamp(1.95rem,5.4vw,3rem)}
.mf-text{font-size:clamp(2.2rem,7vw,5rem)}
@media(min-width:860px){.hero--home .hero-art{min-height:560px}.hero--home .hero-impulso{width:min(100%,470px)}.hero--home .hero-blob{width:min(100%,520px)}}
@media(max-width:820px){.hero--home .hero-art{flex-direction:column;align-items:center;min-height:0}.hero--home .speech{position:relative;margin:.5rem auto 0;max-width:270px;z-index:2;text-align:center}}
@media(min-width:821px){.hero--home .speech{z-index:2;right:-1.5rem;bottom:14%}}

/* === Ronda 2 (22 oct) === */
/* 1. Tu proceso: línea que une los pasos al bajar */
.steps.linea{grid-template-columns:1fr!important;position:relative;padding-left:3.4rem;gap:1rem}
.steps.linea .step{position:relative;grid-column:auto!important}
.steps.linea .step::before{position:absolute;left:-3.4rem;top:1rem;margin:0;background:#cfe0ec;transition:background .4s,transform .4s,box-shadow .4s;z-index:1}
.steps.linea .step.on::before{background:var(--cyan);transform:scale(1.12);box-shadow:0 0 0 6px rgba(0,139,210,.15)}
.steps.linea .rail{position:absolute;left:calc(16px - 1.5px);top:1.6rem;bottom:1.6rem;width:3px;background:#dbe8f2;border-radius:3px}
.steps.linea .rail i{display:block;width:100%;height:var(--p,0%);background:linear-gradient(var(--cyan),var(--turquesa));border-radius:3px}

/* 2. Subrayado que se dibuja */
.subr{background-image:linear-gradient(var(--turquesa),var(--turquesa));background-repeat:no-repeat;background-position:0 94%;background-size:0% .12em;transition:background-size 1.1s cubic-bezier(.2,.7,.2,1) .25s}
.subr.vis{background-size:100% .12em}
.hero--home .subr{background-image:linear-gradient(#bff0ff,#bff0ff)}

/* 4. Pulso suave en WhatsApp */
.btn-wa{position:relative}
.btn-wa::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;animation:waPulso 6s ease-out 2s infinite}
@keyframes waPulso{0%{box-shadow:0 0 0 0 rgba(30,177,90,.55)}14%{box-shadow:0 0 0 14px rgba(30,177,90,0)}100%{box-shadow:0 0 0 0 rgba(30,177,90,0)}}

/* 5. Tarjetas que se levantan */
@media (hover:hover){
  .goal,.prog,.step,.cards .card,.reviews{transition:transform .25s ease,box-shadow .25s ease}
  .cascada.listo>*{transition:transform .25s ease,box-shadow .25s ease!important;transition-delay:0s!important}
  .goal:hover,.prog:hover,.step:hover,.cards .card:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(7,47,95,.14)}
}

@media (prefers-reduced-motion: reduce){
  .subr{transition:none;background-size:100% .12em}
  .btn-wa::after{animation:none}
  .steps.linea .rail i{height:100%}
  .goal:hover,.prog:hover,.step:hover,.cards .card:hover{transform:none}
}
